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({...

event上記の変更を行ってみてください。1)コールバックに引数を追加し、 2).preventDefault()メソッドを実行します。submit イベントで AJAX を使用する場合、これはページのリロードを停止し、非同期リクエストを中断するために必要です。

それ以上の問題があるかもしれませんが、うまくいけば、それが正しい軌道に乗るでしょう.

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

すべてのフォームにバインドされます。に変更します

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

2 番目のフォームではなく、最初のフォームにのみバインドします。

于 2012-05-15T03:40:16.587 に答える