0

私はjqueryタブを作成しましたが、タブの内側にはフォームがあり、その下部にこのボタンがあります。

<button id="submitForm" onclick="formSubmition();">Submit</button>

ここにヘッダーがあります

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<script src="js/lib.js"></script>

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<link rel="stylesheet" href="css/style.css" />

formSubmition() は lib.js ファイルに存在し、ここにそのコードがあります

function formSubmition(){

    $recId              = $("#recId").val();
    $collectionDate     = $("#collectionDate").val();
    $collectorsName     = $("#collectorsName").val();
    $donorsName         = $("#donorsName").val();
    $sciName            = $("#sciName").val();
    $family             = $("#family").val();
    $comName            = $("#comName").val();
    $variety            = $("#variety").val();
    $area               = $("#area").val();
    $location           = $("#location").val();
    $altitude           = $("#altitude").val();
    $geoOrientation     = $("#geoOrientation").val();
    $geoCoordinates     = $("#geoCoordinates").val();
    $soilDescription    = $("#soilDescription").val();
    $habitatDescription = $("#habitatDescription").val();
    $plantPopulation    = $("#plantPopulation").val();
    $photoDate          = $("#photoDate").val();
    $photoId            = $("#photoId").val();
    $photoComments      = $("#photoComments").val();    
    $soilTaken          = 0;
    $seedQuantity       = $("#seedQuantity").val();
    $plantQuantity      = $("#plantQuantity").val();
    $graftQuantity      = $("#graftQuantity").val();
    $moreInfo           = $("#moreInfo").val();

    if($('#soilTaken').is(':checked'))          // Checking if Checkbox was checked.
        $soilTaken  = 1;


    jQuery.ajax({
        type: 'POST',
        async: true,
        url: 'classes/classController.php',
        data: {method: "recNewPlant", recId: $recId, collectionDate: $collectionDate, collectorsName: $collectorsName, donorsName: $donorsName, sciName: $sciName, family: $family, comName: $comName, variety: $variety, area: $area, location: $location, altitude: $altitude, geoOrientation: $geoOrientation, geoCoordinates: $geoCoordinates, soilDescription: $soilDescription, habitatDescription: $habitatDescription, plantPopulation: $plantPopulation, photoDate: $photoDate, photoId: $photoId, photoComments: $photoComments, soilTaken: $soilTaken, seedQuantity: $seedQuantity, plantQuantity: $plantQuantity, graftQuantity: $graftQuantity, moreInfo: $moreInfo},
        contentType: ('application/x-www-form-urlencoded'),
        dataType: "json",
        success : function(json){

          if(json.status == '1'){
              alert("Added!");
          }else{
            alert("Problema!");
          }
        }
    });

}

問題は、この方法を何度も使用したことですが、このように動作するのは初めてです。私が意味したのは。ボタンを押すと、ほとんどの場合何も起こらず、(まれに) クロムのみ (Firefox ではない) でサーバーにリクエストが送信され、「問題」メッセージが返されます。

2 つのブラウザのキャッシュを消去しましたが、何も変わりませんでした。また、OWASP ZAP を使用してトラフィックを確認していますが、実際には POST 要求を送信しません。タブがその問題を引き起こしているのではないかと思いましたが、理由がわかりません。

タブをセットアップする方法は次のとおりです。

$("#mainTabs").tabs();

4

3 に答える 3

0

チェックする必要はありません

if(json.status == '1'){
              alert("Added!");
          }else{
            alert("Problema!");
          }

リクエストが成功した場合のみ success function() が実行されます

これを試して

ajax呼び出しでエラーをチェックするerror:function()場合、エラーが発生した場合にエラーを警告するを追加しました

function formSubmition(){

    $recId              = $("#recId").val();
    $collectionDate     = $("#collectionDate").val();
    $collectorsName     = $("#collectorsName").val();
    $donorsName         = $("#donorsName").val();
    $sciName            = $("#sciName").val();
    $family             = $("#family").val();
    $comName            = $("#comName").val();
    $variety            = $("#variety").val();
    $area               = $("#area").val();
    $location           = $("#location").val();
    $altitude           = $("#altitude").val();
    $geoOrientation     = $("#geoOrientation").val();
    $geoCoordinates     = $("#geoCoordinates").val();
    $soilDescription    = $("#soilDescription").val();
    $habitatDescription = $("#habitatDescription").val();
    $plantPopulation    = $("#plantPopulation").val();
    $photoDate          = $("#photoDate").val();
    $photoId            = $("#photoId").val();
    $photoComments      = $("#photoComments").val();    
    $soilTaken          = 0;
    $seedQuantity       = $("#seedQuantity").val();
    $plantQuantity      = $("#plantQuantity").val();
    $graftQuantity      = $("#graftQuantity").val();
    $moreInfo           = $("#moreInfo").val();

    if($('#soilTaken').is(':checked'))          // Checking if Checkbox was checked.
        $soilTaken  = 1;


    jQuery.ajax({
        type: 'POST',
        async: true,
        url: 'classes/classController.php',
        data: {method: "recNewPlant", recId: $recId, collectionDate: $collectionDate, collectorsName: $collectorsName, donorsName: $donorsName, sciName: $sciName, family: $family, comName: $comName, variety: $variety, area: $area, location: $location, altitude: $altitude, geoOrientation: $geoOrientation, geoCoordinates: $geoCoordinates, soilDescription: $soilDescription, habitatDescription: $habitatDescription, plantPopulation: $plantPopulation, photoDate: $photoDate, photoId: $photoId, photoComments: $photoComments, soilTaken: $soilTaken, seedQuantity: $seedQuantity, plantQuantity: $plantQuantity, graftQuantity: $graftQuantity, moreInfo: $moreInfo},
        contentType: ('application/x-www-form-urlencoded'),
        dataType: "json",
        success : function(json){
             alert(success);
        },
      error: function(jqXHR, textStatus, errorThrown) {
         alert(textStatus, errorThrown);
      }
    });

}

これが役に立てば幸いです、ありがとう

于 2013-09-01T11:26:04.520 に答える