Question

我正在尝试将数据从表单传递到插入脚本而不清除表单数据。我正在使用此功能按下提交按钮，但我什么都没得到。如果表单缺少数据，它甚至会设置为抛出错误，但它甚至没有达到那么远。我只能假设我没有正确地调用它。

$(function() {
    $(".submit").click(function() {
        var facility = $("#facility").val();
        var riskclient = $("#riskclient").val();
        var riskdate = $("#riskdate").val();
        var dataString = 'facitlity=' + facility + '&riskclient=' + riskclient + '&riskdate=' + riskdate;

        if (facility == '' || riskclient == '' || riskdate == '') {
            $('.success').fadeOut(200).hide();
            $('.error').fadeOut(200).show();
        } else {
            $.ajax({
                type: "POST",
                url: "insertriskass.php",
                data: dataString,
                success: function(){
                    $('.success').fadeIn(200).show();
                    $('.error').fadeOut(200).hide();
                }
            });
        }
        return false;
    });
});

<div class="body">   
    <div align='center'>
        <div class="tablebackground">
            <form  method ="post" name= "form"  id="form">            
                <table border='1' >
                    <tr>
                        <td>Facility</>
                        <td><input  type="text" name= "riskFacility" id="facility"></td>
                        <td rowspan='4'><input type="submit" name="submit" value="New Client" class="submit"/</td>
                    </tr>
                    <tr>
                        <td>Client</td>
                        <td><input required type="text" name="riskClientId" id="riskclient" value="<?php echo htmlspecialchars($_POST['riskClientId']); ?>"></td>
                    </tr>
                    <tr>
                        <td>Audit Date</td><td> <input required type="text" id="datepicker"     name="riskauddate" id="riskdate"></td>
                    </tr>
                </table>
            </form>

绝对不会向插入脚本传递任何内容。所以，我认为我错误地称它为。

Answer 1

我看到你的html标签没有正确关闭

<div class="body">

  <form method="post" name="form" id="form">

    <table border='1'>
      <tr>
        <td>Facility</td>
        <td>
          <input type="text" name="riskFacility" id="facility">
        </td>
        <td rowspan='4'>
          <input type="submit" name="submit" value="New Client" class="submit" /> </td>
      </tr>
      <tr>
        <td>Client</td>
        <td>
          <input required type="text" name="riskClientId" id="riskclient" value="">
        </td>
      </tr>
      <tr>
        <td>Audit Date</td>
        <td>
          <input required type="text" id="datepicker" name="riskauddate" id="riskdate">
        </td>
      </tr>

    </table>
  </form>

并检查是否有错误回叫

Answer 2

我觉得它很有用..

$(document).ready(function () {
$('#submit').on('click', function (event) {
    event.preventDefault();
    var facility = $("#facility").val();
var riskclient = $("#riskclient").val();
var riskdate = $("#riskdate").val();

var dataString = 'facitlity='+ facility + '&riskclient=' + riskclient + '&riskdate=' + riskdate; 
or 
// var datastring = $("#form").serialize();

if(facility=='' || riskclient=='' || riskdate=='' )
{
$('.success').fadeOut(200).hide();
$('.error').fadeOut(200).show();
}
else
{
$.ajax({
type: "POST",
url: "insertriskass.php",
data: dataString, 
success: function (msg) {
$('.success').fadeIn(200).show();
$('.error').fadeOut(200).hide();
}
});
}
return false;
});
})

event.preventDefault用于停止提交和页面重新加载。 datastring = $（“＃form”）。serialize（）;用于提交所有数据值，因此无需采用每个变量赋值。

Answer 3

你可以像这样重构一些代码，修改你的html标签。您在输入中有一个双重id属性，并且缺少clousure标记。

$(document).ready(function() {
    $(".submit").click(function(event) {
        event.PreventDefault();
        var facility = $("#facility").val();
        var riskclient = $("#riskclient").val();
        var riskdate = $("#riskdate").val();
        var dataString = 'facitlity=' + facility + '&riskclient=' + riskclient +    '&riskdate=' + riskdate;

        if (!facility || !riskclient || !riskdate) {
           $('.success').fadeOut(200).hide();
           $('.error').fadeOut(200).show();
        } else {
           //send ajax post
        }
    });
});

Jquery .post（）没有调用脚本

3 个答案: