Javascript 如何将文本框插入按钮对话框区域_Javascript_Jquery_Asp.net Mvc 3_Dialog

Javascript 如何将文本框插入按钮对话框区域

javascript jquery asp.net-mvc-3

Javascript 如何将文本框插入按钮对话框区域,javascript,jquery,asp.net-mvc-3,dialog,Javascript,Jquery,Asp.net Mvc 3,Dialog,我有一个聊天室，它有一个如下所示的对话框窗口：基本上我想把文本框移到按钮区 divnodecopy = document.getElementById(div_node); $(divnodecopy).dialogr({ autoOpen:true, maximized: true, minimized: true,

我有一个聊天室，它有一个如下所示的对话框窗口：

基本上我想把文本框移到按钮区

 divnodecopy = document.getElementById(div_node);
             $(divnodecopy).dialogr({
                    autoOpen:true,
                     maximized: true,
                    minimized: true,
                    buttons: { 
                   "Send": {
                       text: 'Send', 
                       click: function () {
                                        alert("here");
                                        // do stuff
                                    }
                       }
                   }, 
                      });
  document.getElementById(div_node).appendChild(element1);
// element1 - input text i want to move in dialogr

我到处都在寻找解决方案，但没有任何帮助。提前谢谢

编辑：添加了创建div

 var div = document.createElement("div");
                    div.setAttribute("id", "1");

                    var element = document.createElement("input");
                     element.setAttribute("type", "text");
                     element.setAttribute("value", "");
                     element.setAttribute("id", "textReceived");
                     div.appendChild(element);

                    var element1 = document.createElement("input");
                     element1.setAttribute("type", "text");
                     element1.setAttribute("value", "");
                     element1.setAttribute("id", "textSend:");
                    document.body.appendChild(div);
                    divnodecopy = document.getElementById(div_node);


$（文档）.ready（函数（）{
createChatDialogerBox（1，‘Thulasi Ram.S’）；
函数createChatDialogerBox（fromUserId，fromUserName）{
if（$（'#chatDialogerBox'+fromUserId）.length==0）{
var divnodecopy=$（''）.append（''，{'type'：'text'，'value'：''，'id'：'textcreceived'，'class'：'messageReceived'}）；
$（divnodecopy）.dialogr({
自动打开：真，最大化：真，最小化：真，
标题：fromUserName，
按钮：{
“发送”：{
文本：“发送”，
单击：函数（）{
警报（“此处”）；
//做事
}
}
}
});
//$（“#chatDialogerBox”+fromUserId）.父项（“.ui对话框”）.查找（“.ui对话框按钮窗格”）
//.append（“”，{'type'：'text'，'value'：“”，'id'：'textSend'}）；
//或
$（“#chatDialogerBox”+fromUserId）.父项（“.ui对话框”）.查找（“.ui对话框按钮窗格”）
.prepend（“”，{'type'：'text'，'value'：“”，'id'：'textSend'，'class'：'messageSend'}）；
}
};
});
.messageSend
{
右边距：20px；
}

对话框的HTML标记在哪里？div_nodeI使用create元素（“div”）动态创建div_节点，并将这两个元素（以及它们的传入样式）添加到html中，让我们看看如何帮助您。好的。我刚刚在类似jqueryui的链接中添加了createdivcanupostur代码，用于css和js文件。可用于dialogr插件。通过此处的链接，我可以在（）中显示lile演示

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <link href="css/ui-lightness/jquery-ui-1.8.6.custom.css" rel="stylesheet" type="text/css" />
    <link href="css/jquery.dialogr.css" rel="stylesheet" type="text/css" />
    <script src="../Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="js/jquery-ui-1.8.6.custom.min.js"></script>
    <script type="text/javascript" src="js/ui.dialogr.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {

            createChatDialogerBox(1, 'Thulasi Ram.S');

            function createChatDialogerBox(fromUserId, fromUserName) {
                if ($('#chatDialogerBox' + fromUserId).length === 0) {

                    var divnodecopy = $('<div id="chatDialogerBox' + fromUserId + '" class="chatDialogerBox"></div>').append('<input />', { 'type': 'text', 'value': '', 'id': 'textReceived', 'class': 'messageReceived' });

                    $(divnodecopy).dialogr({
                        autoOpen: true, maximized: true, minimized: true,
                        title: fromUserName,
                        buttons: {
                            "Send": {
                                text: 'Send',
                                click: function () {
                                    alert("here");
                                    // do stuff
                                }
                            }
                        }
                    });

                    //$('#chatDialogerBox' + fromUserId).parents('.ui-dialog').find('.ui-dialog-buttonpane')
                    //.append('<input />', { 'type': 'text', 'value': '', 'id': 'textSend' });

                    //Or

                    $('#chatDialogerBox' + fromUserId).parents('.ui-dialog').find('.ui-dialog-buttonpane')
                    .prepend('<input />', { 'type': 'text', 'value': '', 'id': 'textSend', 'class': 'messageSend' });
                }
            };
        });
    </script>
    <style type="text/css">
        .messageSend
        {
            margin-right: 20px;
        }
    </style>
</head>
<body>
</body>
</html>