3

ajaxを使用してライトボックスからコントローラーにデータをPOSTしようとしましたが、もちろんうまくいきません。

2 つの選択リストがあり、どちらもデフォルトのコントローラーから取り込まれています。値を選択して送信をクリックすると、エラー ボックスが一時的に点滅して再び消えます。

firebug ネットワーク タブを使用すると、POST リクエストが表示されますが、投稿タブの下にはデータがありません。私はjavascript自体で何か間違ったことをしているに違いありませんが、私には問題ないように見えます.

これが私のコードです...

<body style="background-color: #f0f0f0;">
<div style="margin: 5px;">

<div id="ajax-login-register">

    <div id="login-box">
        <div style="text-align: center; font-weight: bold; font-size: 20px; margin: 10px 0 20px 0; border-bottom: #ccc 2px dashed; padding-bottom: 12px;"><?=lang('login')?></div>
        <form id="login-form">

        <select name="currency_sel" id="brand_country" class="form_select_200px">

            <option value="0" selected><i>Select your preferred Currancy</i></option>
                <?php foreach($currencies as $currency): ?>
                <option value="<?php echo $currency['currency_id']; ?>"><?php echo $currency['currency_name']; ?></option>
                <?php endforeach; ?>
            </select>
        </form>
  </div>

    <div id="register-box">

        <div style="text-align: center; font-weight: bold; font-size: 20px; margin: 10px 0 20px 0; border-bottom: #ccc 2px dashed; padding-bottom: 12px;"><?=lang('meta_description')?></div>
        <form id="register-form">            

            <select name="language_sel_1" id="brand_country" class="form_select_200px">                 
            <option value="0" selected>Select your preferred Language</option>
                <?php foreach($languages as $language): ?>
                <option value="<?php echo $language['language_id']; ?>"><?php echo $language['language_name']; ?></option>
                <?php endforeach; ?>
            </select>

            <select name="language_sel_2" id="brand_country" class="form_select_200px">                 
            <option value="0" selected>Select your preferred Language</option>
                <?php foreach($regions as $region): ?>
                <option value="<?php echo $region['country_id']; ?>"><?php echo $region['country_name']; ?></option>
                <?php endforeach; ?>
            </select>

            <div class="line">&nbsp;</div>
        </form>

    </div> 
        <div>
            <form>
                <button id="ajax-submit-button" style="font-size: 14px;"><?//=lang('register')?>Submit</button>
            </form>
        </div>
</div>

</div>

<script type="text/javascript">

$(document).ready(function(){

$('#ajax-login-button').button({
    icons: {
        primary: "ui-icon-check"
    }
});

$('#ajax-submit-button').click(function(){

    var error = false;

    if(error){
        return false;
    } else {
        $.ajax({
            url: "<?=site_url('locale/set_ui_lang')?>",
            type: "POST",
            dataType: "json",              
            data: ({
                'currency_sel'      : $('#currency_sel :selected').val(),
                'language_sel_1'        : $('#language_sel_1 :selected').val(),
                'language_sel_2'        : $('#language_sel_2 :selected').val()
            }),
            success: function(data){
                    parent.$.colorbox.close();
                    parent.location.reload();
                },
            error: function(xhr, ajaxOptions, thrownError){
                 alert("ERROR! \n\n readyState: " + xhr.readyState + "\n status: " + xhr.status + "\n thrownError: " + thrownError + "\n ajaxOptions: " + ajaxOptions);
                }            
            });                
        }
    });
});
</script>

</body>

エラー通知が準備完了状態を示し、ステータスが両方とも 0 になった場合、 throwederror は単なるエラーです。

また、受信コントローラーは現在、テストするだけの print_r(&_POST) です。

誰かがそれを助けることができれば、私はこれを自分で乗り越えることができないようです。

ありがとう

4

5 に答える 5

1

同じ名前の複数の ID を使用することはできず、セレクターが間違っています。

$('#currency_sel :selected').val()$('select[name="currency_sel"] option:selected').val()他のものと同じでなければなりません 。

編集

データの括弧を削除します。

data: {
                currency_sel : $('select[name="currency_sel"] option:selected').val(),
                language_sel_1 : $('select[name="language_sel_1"] option:selected').val(),
                language_sel_2 : $('select[name="language_sel_2"] option:selected').val()
            },
于 2013-08-08T01:30:00.350 に答える
1

それは私だけですか、それともAJAXを起動する代わりにクリックイベントを偽にしていますか?

var error = false;

    if(error){
        return false;
    }
于 2013-08-08T00:10:29.467 に答える
1

あなたの ajax 呼び出しは、別のフォーム内のボタンのクリック ハンドラーにあります。

これが何が起こっているかです..

ボタンをクリックすると、ajax 呼び出しがトリガーされます。

その後、クリック ハンドラーは正常に戻り、ボタンを含むフォームが送信されます。

それが発生すると、新しいページが読み込まれ、ブラウザは保留中の ajax リクエストをキャンセルし、エラーが発生します。(エラー アラートで [OK] をクリックすると、通常のページの読み込みに気付くはずです)

return false;それを防ぐには、ajax 呼び出しの後、またはpreventDefault()イベント オブジェクトを呼び出すことができます。

$('#ajax-submit-button').click(function(e){

    e.preventDefault();

    /* Rest of the code */

});

これで問題が解決するはずです。

*編集: *e関数定義のパラメーターに注意してください

于 2013-08-08T03:39:19.987 に答える
1

データ オブジェクトのキーは引用符で囲まないでください。

次のように変更すると、動作するはずです (値の jQuery 呼び出しが機能する場合)。

data: {
    currency_sel: $('#currency_sel :selected').val(),
    language_sel_1: $('#language_sel_1 :selected').val(),
    language_sel_2: $('#language_sel_2 :selected').val()
},

ソース: jQuery.ajax() ドキュメント

于 2013-08-08T00:05:34.577 に答える