ajax 이벤트에 문제가 발생했습니다.

데이터를 데이터베이스에 추가하기 위해 제출 버튼을 눌렀을 때 트리거되는 ajax 이벤트를 사용하고 있습니다.하지만이 페이지를 orignally 만들었을 때 테스트 목적으로 모두 seprate 파일에 있었기 때문에 지금 가지고있을 때 모든 코드를 함께 넣어 내가 그 페이지를 새로 고치기 위해 사용중인 버튼을 제출하고 그 데이터를 변경하여 그것을 필터링하여 아약스 쿼리를 실행하는 데 사용하고 있다는 통지를 가지고 내가 코드 울부 짖는 소리를 배치했습니다 .. 나는 무엇에 아주 난처한입니다 이것에 대해 갈 수있는 유일한 방법 ...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>

출처

2012-05-15 Matthew

와트 않았다 편집 ?? – Matthew

Matthew, "편집 된"(이 순간부터 - "13 분 전"이라고 말한 것) 옆의 하이퍼 링크를 클릭하면 정확히 무엇이 변경되었는지 확인할 수 있습니다. – nnnnnn

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

은 모든 양식에 바인딩됩니다.

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

으로 변경하면 두 번째가 아닌 첫 번째 양식에만 바인딩됩니다.

출처

2012-05-15 03:40:16

ID로 선택하면 태그 이름이 중복됩니다.'$ ('# form1a')'는 작업을보다 효율적으로 수행합니다. – nnnnnn

에 동의했으며,이 경우에는 합리적입니다. 나는'$ ('form # numberOne')와 같이 요청의 컨텍스트를 이해하는 데 도움이되는 태그 이름을 사용하는 경향이있다. –

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

) 1 위의 변경을 콜백 2로 event 인수를 추가하십시오) .preventDefault() 메서드를 실행합니다. 제출 이벤트와 함께 AJAX를 사용할 때 페이지가 다시로드되거나 비동기 요청이 중단되는 것을 막으려면이 작업이 필요합니다.

그 이상의 문제가있을 수 있지만 잘하면 올바른 방향으로 이동하게됩니다.

출처

2012-05-15 03:39:15 marteljn

무슨 뜻 이죠? 그게 데이터베이스에 데이터를 추가하는 것을 멈추지 않을 것을 의미합니까? – Matthew

아니요, AJAX 요청을 수행 중이므로 페이지를 다시로드하지 않고 서버와 통신합니다. 페이지를 새로 고침하여 Ajax 요청을 제거하고 requestadd.php에 직접 게시하려는 경우 또한 다른 대답의 조언을 따라야합니다. 올바른 양식에 바인딩해야합니다. – marteljn

ajax 이벤트에 문제가 발생했습니다.

답변

관련 문제