0

我正在使用一个 ajax 事件,当我点击提交按钮将数据添加到数据库时触发,但是因为当我最初创建这个页面时,它们都在单独的文件中用于测试目的,所以现在当我把所有代码放在一起时,我有请注意,我用来刷新页面的 4 个提交按钮,然后通过过滤更改正在看到的数据正在触发 ajax 查询,我已将代码放在下面。我很困惑唯一的解决方法是什么。 ..

<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
    $(function()
    {

$("input[type='checkbox']").on('click', function() {

    var $this = $(this);
    var isChecked = $this.prop('checked');

    var checkVal = isChecked ? $this.attr('id') : $this.attr("value");
    var process= $this.attr("value");
    var userid = $this.attr('name');

            $.ajax({
            type: "GET",
            url: 'request.php',
            data: {
            'uname': checkVal,
            'id': userid

                },
            success: function(data) {

        if(data == 1){//Success 
             alert('Sucess');
          }
        if(data == 0){//Failure 
             alert('Data was NOT saved in db!');
          }
            }
    });
  });

 $('form').bind('submit', function(){  // it is triggering this peice of code when the submit buttons are clicked ???
                $.ajax({
                    type: 'POST',
                    url: "requestadd.php",
                    data: $("form").serialize(),

                    success: function(data) {

                            if(data == 1){//Success 
                                    alert('Sucess');
                                         }
                             if(data == 0){//Failure 
                                    alert('Data was NOT saved in db!');
                                         }
                                 }
                });
                return false;
            });
                      $("#claim").change(function(){       
             $("#area").find(".field").remove();
             //or
               $('#area').remove('.field');
          if( $(this).val()=="Insurance")
             {
        $("#area").append("<input class='field' name='cost' type='text' placeholder='Cost' />");

             }
          });
  });

</script>
    </head>
        <body>
        <div id="add">
        <form name="form1aa" method="post" id="form1a" >
 <div id="area">
 <input type=text name="cases"  placeholder="Cases ID">
         <select id="claim" name="claim">
            <option value="">Select a Claim</option>
        <option value="Insurance">Insurance</option>  
        <option value="Warranty">Warranty</option>
        </select>
        </div>
    <select name="type" onChange=" fill_damage (document.form1aa.type.selectedIndex); ">
    <option value="">Select One</option>
    <option value="Hardware">Hardware</option>
    <option value="Software">Software</option>
    </select>

    <select name="damage">
    </select>
    <br />
    <input type=text name="comment"  placeholder="Comments Box">
    <input type="submit" value="Submit" name="Submit">
    </form>
    </div>
    <?  

        $sql="SELECT * FROM $tbl_name ORDER BY cases ASC";

    if(isset($_POST['tpc'])){
        $sql="select * from $tbl_name WHERE class LIKE '1%' ORDER BY cases ASC";
    }
    if(isset($_POST['drc'])){
        $sql="select * from $tbl_name WHERE class LIKE 'D%' ORDER BY cases ASC";
    }
    if(isset($_POST['bsc'])){
        $sql="select * from $tbl_name WHERE class LIKE 'B%' ORDER BY cases ASC";
    }
    $result=mysql_query($sql);

    ?>

<!-- Filter p1 (Start of) !-->
<form action="ajax-with-php.php" target="_self">
<input type="submit" name="all" value="All" />  // the issue is mainly occuring here when i click any of thesse meant to refesh the page and change the query with the if statements but is trigger the other code i commented
<input type="submit" name="tpc" value="TPC" /> 
<input type="submit" name="drc" value="DRC" />
<input type="submit" name="bsc" value="BSC" />
</form>
4

2 回答 2

1
 $('form').bind('submit', function(event){  
    event.preventDefault();
    $.ajax({...

尝试进行上述更改 1) 将event参数添加到回调 2) 执行.preventDefault()方法。将 AJAX 与提交事件一起使用时,必须阻止页面重新加载并中断您的异步请求。

可能还有更多的问题,但希望这会让你走上正轨。

于 2012-05-15T03:39:15.090 回答
1
$('form').bind('submit', function(){ ...

将绑定到所有表单。将其更改为

$('form#form1a').bind('submit', function(){ ...

它只会绑定到第一种形式,而不是第二种形式。

于 2012-05-15T03:40:16.587 回答