-4

私はphpによって生成されたテーブルを持っており、ユーザーが変数によって生成されたテキストを変更できるようにモーダルを実装しています$l_id。モーダルdivセクションを表示するリンククラス「eloc」があります。フォーム送信ID「renameLocation」をインターセプトして入力を処理し、デフォルトの送信アクションを無効にします。ユーザーが名前を変更した新しいテキストを表示するように変更したいと思います。

私は配列を反復することによって繰り返されるこのphpコードを持っています、反復IDは$l

$id_l="\"location_".$l."\"";
echo "<table class=\"add\" border=\"1px\" width=\"100%\">";
echo "<tr class=\"header\"><td class=\"stretch\"><a class=\"eloc\" rel=\"leanModal\" href=\"#modal_location\"><img src=\"images/edit-icon.png\" alt=\"Location\"></a></td><td id=\"".$id_l."\" class=\"location\" colspan=\"6\">Location: ".$row['location']."</td></tr>";

それから私はdivを持っています：

<div id="modal_location" class="modal_prompt">      
    <div class="modal_prompt-ct">           
        <div class="modal_prompt-header">
            <h2>Rename Location</h2>
            <a class="modal_close" href="#"></a>            
        </div>

        <form id="renameLocation">
            <div class="txt-dpy">
                <span id="mlocation_name"></span>
            </div>
            <div class="txt-fld">
                <label for="">Change to</label> 
                <input id="newLocation" name="" type="text" />
            </div>
            <div class="btn-fld">
                <button type="submit">Save &raquo;</button>
            </div>          
        </form>         
    </div>  
</div>

生成された$l_idのテキストを変更するにはどうすればよいですか？

$("#renameLocation").submit(function(e) 
{
    $("#lean_overlay").fadeOut(200);
    $("#modal_location").css({"display" : "none" })
    // How to modify the text of "$l_id"?
    return false; //do not submit form the normal way        
});

どうもありがとう。

4

2 に答える 2

1

あなたはこのように試すことができます-

$("#<?php echo $l_id?>").html("Your updated text here");
于 2013-01-06T04:17:34.417 に答える
1

質問はあいまいです。編集するテキストが複数あるようです。

更新する場所をJSに指示する方法が必要なので、グローバル変数を追加します。これを行うのは通常の方法ではありませんが、問題ないはずです。

要素にデータを追加します

$id_l="\"location_".$l."\"";
echo "<table class=\"add\" border=\"1px\" width=\"100%\">";
echo "<tr class=\"header\"><td class=\"stretch\"><a class=\"eloc\" rel=\"leanModal\" href=\"#modal_location\" 
    data-location=\"".$l."\"><img src=\"images/edit-icon.png\" alt=\"Location\"></a></td><td id=\"".$id_l."\" class=\"location\" colspan=\"6\">Location: ".$row['location']."</td></tr>";

これをあなたのjsの一番上に設定してください

var selectedlocation=0;

編集リンクをクリックしてバインドし、選択した場所を設定します

$('.eloc').on('click', function(){
    selectedlocation=$(this).data('location');
});

コードでvarを使用する

$("#renameLocation").submit(function(e) 
{
    var location=$(this).data('location');
    $("#lean_overlay").fadeOut(200);
    $("#modal_location").css({"display" : "none" })
    $('#location_'+selectedlocation).text();
    e.preventDefault(); //return false; //do not submit form the normal way        
});

これが別の方法です

グローバル変数を忘れてください。

非表示のフォームフィールドを追加する

<form id="renameLocation">
    <input type="hidden" name="location" value="" id="renameLocation_location"/>

その中に値を入れてください

$('.eloc').on('click', function(){
    $('#renameLocation_location').val($(this).data('location'));
});

そしてそれを使用します。

$('#location_'+ $('#renameLocation_location').val() ).text();

あなたがそれを提供した方法で、モーダルはあなたが望むものを達成するためにどこかに設定するためにあなたが必要とするリンクに完全に独立しています。

于 2013-01-06T04:28:32.707 に答える