以弹出形式获取按钮的值

时间:2016-12-05 21:36:15

标签: javascript jquery html forms

我有一个具有当前日期值的按钮。当我点击按钮时,弹出窗体应该打开,它将有一个文本框,其中包含按钮的值。提交表单后,按钮值应相应更改

这是我的HTML表单

 <button id="appDate" ></button>
<div id="popupForm" style="display:none;">
    <form action = "" method="POST">
        <input type="text" name = "date" value="" />
        <input type="submit" value="Submit" />
    </form>
</div>

Jquery代码

$(document).ready(function(){
  now = new Date();
  y = now.getFullYear();
  m = now.getMonth()+1;
  d = now.getDate();
  h = now.getHours();
  mi = now.getMinutes();
  full_date = y + '-' + (m<10?'0'+m:m) + '-' + (d<10?'0'+d:d) + ' ' + (h<10?'0'+h:h) + ':' +(mi<10?'0'+mi:mi);
  $('#appDate').text(full_date);
});

  $(function(){
    $( "#popupForm" ).dialog({
    autoOpen: false
  });

  $("#appDate").click(function() {
    $("#popupForm").dialog('open');
  });
});

当我打开表单时,我应该能够在表单中获取该日期,并在提交之后,无论我输入的日期应该是按钮

1 个答案:

答案 0 :(得分:2)

您需要挂钩该输入的更改事件并相应地设置按钮文本:

$("input[type=text]").change(function() {
    $("#appDate").prop('value', $( this ).text());
});

要在打开对话框时执行某些操作,您必须将功能传递给它的打开字段。最后,您的代码如下所示:

 $('#dialogbox').dialog({          
      autoOpen:false,
      open: function() {
          // use above code
      }
  });