Ajax - データを取得する方法

Ajaxを使用してデータを取得しようとしています。以下は、入力値を持つHTMLフォームのコードです。データ値は、送信ボタンを介してPythonハンドラにプッシュされます。サーバー側では、pythonハンドラはデータをデータベースに格納します。Ajax - データを取得する方法

これでAJAX経由でデータベースからデータを取り出し、既存の値があるかどうかを表示する必要があります。データは「はいまたはいいえ」のステータスで構成されているため、非常にシンプルです。しかし、私はajaxを使用してデータをフェッチする方法を知らず、フェッチされたデータに基づいて入力値を適切に設定します。質問は、Ajaxを介して値を返すハンドラをどのように呼び出すのでしょうか？

<html> 
 
<script language="javascript" src="https://code.jquery.com/jquery-1.11.1.min.js" type="text/javascript"></script> 
 

 
<script language="javascript" type="text/javascript"> 
 

 
send_data = function(status) { 
 

 
    $.ajax({ 
 
      url: "/Subscription", 
 
      dataType: "json", 
 
      data: {'status' : status}, 
 
      type: "POST", 
 
      cache: false 
 

 
    }).done(function(data, status, xml) { 
 

 
     var obj = jQuery.parseJSON(data); 
 
     alert(obj.success); 
 

 
    }).fail(function(jqXHR, textStatus, errorThrown) { 
 

 
    }).always(function() { 
 

 
    }); 
 

 
} 
 

 

 
$(document).ready(function() { 
 

 
    $("#subscription").submit(function() { 
 
    send_data($("#switch-1").prop('checked') ? 'yes' : 'no'); 
 
     return false; 
 
    }); 
 

 
}); 
 
</script> 
 

 
</head> 
 
<body> 
 
\t 
 
<form id="subscription" action="" method="post"> 
 
    <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect" for="switch-1"> 
 
    <input type="checkbox" id="switch-1" class="mdl-switch__input" id="status" name="status" /> 
 
    <span class="mdl-switch__label">[email protected] subscription status is: <<subscription>> </span> 
 
    <input type="submit" value="Submit" /></label> 
 
</form> 
 
</body> 
 
</html>

本当にありがとうございました。ヒントがあれば助かります。例えば

出典

2016-05-17 user2690151

ユーザー入力に基づいて、非同期呼び出しを実行するには、リクエストを行う必要があり、その後、明示的に要求して実行したいアクションを指定することは成功し、失敗した、など

は：

function send_data(shouldRequest, successCallback) { 

    // if ...prop('checked'), run ajax request 
    if (shouldRequest) { 
    $.ajax({ 
     url: "/Subscription", 
     dataType: "json", 
     data: {'status' : status}, 
     type: "POST", 
     cache: false 
    }).done(function(data, status, xml) { 

     // when request completes, run callback function 
     successCallback(data); 
    }); 
    } 

} 

$("#subscription").submit(function() { 
    var checked = $("#switch-1").prop('checked'); 

    var successCallback = function(data) { 
    // perform success actions on data here 
    } 

    send_data(checked, successCallback); 
});

あなたはsend_data関数にsuccessCallbackを渡す場合は、非同期呼び出しがを正常に完了した場合にのみ機能を実行することができます。他の関数を渡してエラーなどを処理することもできます。

エラーを処理する関数のように、ajaxリクエストとは異なる結果を処理するために、他の関数を渡すこともできます。

出典

2016-05-17 23:09:04 Himmel

あなたのアドバイスのためのあなたのヒンメルともピーターをありがとうございました。私は正常に状態の状態を設定することができました。私は材料デザインライトスイッチ（入力ステートメントを使用して）を使用するjavascriptを修正し、それは正しい状態を設定しました。また、「虚偽を返す」というバグがありました。新しく変更されたクリック機能で両方のアドバイスをいただきありがとうございます。 – user2690151

ajaxにdataType:"json"を設定すると、をdone()コールバックで使用する必要はありません。

あなたのjsonに応じてdata.successまたはdata.statusを使用してください。

例JSON応答 {'success':'yes'}または{'status':'yes'}

出典

2016-05-17 23:19:06

Ajax - データを取得する方法

答えて

関連する問題