2012-04-05 48 views
0

我有了一個對話框窗口,看起來像這樣聊天:

enter image description here如何插圖文本框到按鈕對話框區域


基本上我想文本框移動到按鈕區域。

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 

我也到處去尋找一個解決方案,但沒有幫我出出there.Thanks提前!

編輯:添加創建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); 
+0

凡對於對話框中選擇HTML標記? div_node – 2012-04-05 09:53:01

+0

我用create元素(「div」)動態創建div_node並添加爲2個元素(使用它們的傳入樣式) – 2012-04-05 09:56:09

+0

發佈html,讓我們看看如何爲您提供幫助。 – 2012-04-05 10:00:16

回答

0
<!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> 
+0

中發佈你的代碼,它工作正常。 – Thulasiram 2012-04-27 08:39:03

+0

像jquery ui鏈接文件css和js。可用於對話框plugingin過去的鏈接,我可以在http://jsfiddle.net/中顯示lile演示(http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/base/jquery-ui。 css) – Thulasiram 2012-04-27 09:30:15

相關問題