在jQuery中传递变量以更改对话框标题

时间:2013-03-14 12:45:13

标签: jquery jquery-ui

我正在尝试设置一个对话框,我想按下按钮的名称转移到对话框中,但我不知道该怎么做。

到目前为止,我有:

$(document).ready(function(){
$("#x").live('click', function(){
 var name = $(this).attr('name');  //want to pass this to the next jquery
 $('#dialog_box').dialog("open");
});
var input = $("#input");    
$("#dialog_box").dialog({
    autoOpen: false,
    resizable: false,
    height:180,
    width: 350,
    modal: true,
    buttons: {
        "Update": function(){
            alert(name);
        }
    }
  });
});

另外,如果转移到更新对话框的标题(下面的标记),我将如何使用变量?

<div id="dialog_box" title="name variable here">
 <form id="dialog_form" name="dialog_form">
  <fieldset>
   <input type="text" name="input" id="input"/>
  </fieldset>
 </form>                
</div>

任何帮助表示赞赏:)

2 个答案:

答案 0 :(得分:3)

请使用合适的名称更改文本框ID。

试试这样。

var titleValue=$("#input").val();
$( "#dialog_box" ).dialog({ title: titleValue });

或 你可以覆盖像这样的默认值

$("#dialog_box").dialog("option", "title", $('#titleText').val());

按钮单击处理程序。

 $('#btnOpendialog').on('click', function (e) {
     e.preventDefault();
     $("#dialog_box").dialog('open');
     $("#dialog_box").dialog("option", "title", $('#titleText').val()); // to change the dialog title. 

 })

Working Demo

答案 1 :(得分:1)

首先推荐.live(),我建议使用.on()并尝试.data()方法

$(document).on('click', '#x', function(){
    $('#dialog_box').data('name', $(this).attr('name'));  //passed to dialog
    $('#dialog_box').dialog("open");
});

调用内部对话框

  $("#dialog_box").dialog({
      autoOpen: false,
      resizable: false,
      height:180,
      width: 350,
      title: $(this).data('name'), //will set dialog title 
      modal: true,
      buttons: {
        "Update": function(){
            alert($(this).data('name')); //should return input value
        }
    }
  });
});