Javascript Jquery对话框表单未将字段内容正确过帐到PHP文件

Javascript Jquery对话框表单未将字段内容正确过帐到PHP文件,javascript,php,jquery,html,datepicker,Javascript,Php,Jquery,Html,Datepicker,我的一个网页上有一个链接 <div id="updateDay"><a href="#" id = "updateDiffDay">Update</a> a different day</div> 不同的一天 当用户单击updateDiffDay链接时,会打开一个jquery模式对话框,其中包含一个表单。表单有两个字段,一个是日期选择器,另一个是文本框 <form id="updateDiffDayForm" method="post"

我的一个网页上有一个链接

<div id="updateDay"><a href="#" id = "updateDiffDay">Update</a> a different day</div>
不同的一天
当用户单击updateDiffDay链接时,会打开一个jquery模式对话框,其中包含一个表单。表单有两个字段,一个是日期选择器,另一个是文本框

<form id="updateDiffDayForm" method="post" action="updateDiffDay.php">
    <input class = "field" type="text" placeholder= "Select a date" id="datepicker">
    <input type="text" id="diffDayDailyMetric" class="field" placeholder="Enter weight" />
</form>

对话框上有两个按钮,“更新”和“取消”。当用户单击Update按钮时,表单应将用户在表单上输入的内容发布到updateDiffDay.php文件中

“模式”对话框的代码如下所示:

<script>
$(function() {
$( "#datepicker" ).datepicker({
  dateFormat: 'yy-mm-dd',
  changeMonth: true,
  changeYear: true,
yearRange: "-90:+0"
  });

$( "#dialog" ).dialog({
  autoOpen: false,
  width: 350,
  height: 250,
  modal: true,
  dialogClass: 'ui-dialog',
  draggable: false,
  resizable: false,
  buttons: {
        Update: function () {
    $('#updateDiffDayForm').submit();
        },
        Cancel: function () {
            $(this).dialog("close");
        }
    },

  show: {
    duration: 500
  },
  hide: {
    duration: 500
  }
});

$( "#updateDiffDay" ).click(function() {
  $( "#dialog" ).dialog( "open" );
});
<?php
$date = $_POST['datepicker'];
$metric = $_POST['diffDayDailyMetric'];
echo $date;
echo $metric;

$(函数(){
$(“#日期选择器”)。日期选择器({
日期格式:'年-月-日',
变化月:对,
变化年:是的,
年份范围:“-90:+0”
});
$(“#对话框”)。对话框({
自动打开:错误,
宽度:350,
身高:250,
莫代尔:是的,
dialogClass:“ui对话框”,
可拖动:错误,
可调整大小:false,
按钮:{
更新:函数(){
$('#updateDiffDayForm')。提交();
},
取消:函数(){
$(此).dialog(“关闭”);
}
},
展示:{
持续时间:500
},
隐藏:{
持续时间:500
}
});
$(“#updateDiffDay”)。单击(函数(){
$(“对话框”)。对话框(“打开”);
});
}))

updateDiffDay.php的代码如下:

<script>
$(function() {
$( "#datepicker" ).datepicker({
  dateFormat: 'yy-mm-dd',
  changeMonth: true,
  changeYear: true,
yearRange: "-90:+0"
  });

$( "#dialog" ).dialog({
  autoOpen: false,
  width: 350,
  height: 250,
  modal: true,
  dialogClass: 'ui-dialog',
  draggable: false,
  resizable: false,
  buttons: {
        Update: function () {
    $('#updateDiffDayForm').submit();
        },
        Cancel: function () {
            $(this).dialog("close");
        }
    },

  show: {
    duration: 500
  },
  hide: {
    duration: 500
  }
});

$( "#updateDiffDay" ).click(function() {
  $( "#dialog" ).dialog( "open" );
});
<?php
$date = $_POST['datepicker'];
$metric = $_POST['diffDayDailyMetric'];
echo $date;
echo $metric;
在您的表单中:

<form id="updateDiffDayForm" method="post" action="updateDiffDay.php">
    <input class = "field" type="text" placeholder= "Select a date" id="datepicker">
    <input type="text" id="diffDayDailyMetric" class="field" placeholder="Enter weight" />
</form>

您没有使用名称属性。更新为:

<form id="updateDiffDayForm" method="post" action="updateDiffDay.php">
    <input class="field" type="text" placeholder="Select a date" id="datepicker" name="datepicker">
    <input type="text" id="diffDayDailyMetric" class="field" placeholder="Enter weight" name="diffDayDailyMetric" />
</form>


这应该就够了。

Josh。非常感谢。我以为它用的是“id”而不是“名字”。我花了4个小时想弄清楚到底出了什么问题。我做了那个改变,效果很好。再次感谢你,伙计!没问题。我也做过同样的事。调试从来都不是一件有趣的事。