2017-04-22 1 views
0

3日間、この回答または解決策が見つかりません。私はjQueryの男ではありません。jQueryは、各行のフォームと各行を編集するjqueryコードを含むhtmlテーブルで応答します。新しく作成されたフォームは無視します。submit()

ユーザーは、言語コードを選択して送信するフォームを示すPHPページに到着します。フォームが送信され、jQueryレスポンスが元のページのdivコンテナにテーブルを作成します。ここまでは順調ですね。結果の表には、言語変数を編集できる数百の行が含まれています。編集ボタンをクリックすると、何も得られず、コンソールにエラーはなく、何も表示されません。クリックして使用すると、警告を発することができます。サブミット、バインド、およびその他の多くの機能は動作しません。

テーブルの読み込み、基本編集の実行、データベースへの編集の実行、および編集結果の表示によるdiv.table.rowのリフレッシュを試みています。私は編集されたデータで行を更新する部分には行きませんでしたが、まだ各行に動的フォームを送信しようとしていました。

私がクリックで使用すると起こる1つの面白いことは、クリックする最初のボタンだけで動作し、他のすべての行を無効にします。変更を行うために行を送信し、その行をリフレッシュし、リダイレクトせずに次の行に移動できるようにする必要があります。これはあまりにも多く聞いてもらえますか?または、私はそれらをページごとに移動する必要がありますか?私はjQueryの編集を行うために、各列内の個々のフォームを送信して、言語がそうであるように個々の行をリフレッシュしてもらうにはどうすればよい

if(!empty($_POST['edit_language']) && $_POST['edit_language'] == 1){ 
    edit_language($_POST['lang']); //call function to edit language 
} else { 
    echo "You got here but no variables<br>"; //testing 
    print_r($_POST); //testing 
} 

function edit_language($lang){ 
//query table to get language vars list 
    $sql = "SELECT lang_site.lid, lang_codes.iso_code, lang_codes.`language`, lang_varnames.varid, lang_varnames.varname, lang_site.varval FROM lang_codes LEFT JOIN lang_site ON lang_site.langid = lang_codes.langid LEFT JOIN lang_varnames ON lang_site.varid = lang_varnames.varid where lang_codes.iso_code = '" . $lang . "'"; 
    $result = db_query($sql); 
//generate report table 
    echo "<table cellspacing='0' border='1'><tr><th>Count</th><th>Language</th><th>Variable Id</th><th>Variable Name</th><th>Variable Value</th><th>Edit</th></tr>"; 
    $a=1; //count the rows to number the rows for easy viewing 
    while($data = db_fetch_assoc($result)){ 
//create form in each tr 
     echo "<form name='edit_" . $data['lid'] . "' id='edit_" . $data['lid'] . "' action=''><tr><td>" . $a++ . "</td><td>" . $data['language'] . "</td><td>" . $data['varid'] . "</td><td>" . $data['varname'] . "</td><td><textarea class='form-control' name='varval' id='varval' cols='100' wrap='virtual'>" . $data['varval'] . "</textarea></td><td id='editresponse'><button type='submit' class='button' type='submit' id='but_" . $data['lid'] . "'>Edit</button></td></tr></form>"; 
?> 
//jquery to post edits 
    <script language="javascript"> 
     $(document).ready(function() 
     { //using $.ajax() function 
     //alert("document ready"); //this alerts each row 

//this function will not work, no errors, simply nothing 
      $(document).on("submit", "#edit_<?php echo $data["lid"]; ?>", function(e) 
      { 
     //alert("button clicked"); //this does not work 
        var data = $("#edit_<?php echo $data["lid"]; ?>").serialize(); 
        $.ajax({ 
         type : "POST", 
         url : "/lang/ajax_langs.php", 
         data : data, 
         success : function(response) 
         {  
          { 
           $("#editresponse").html(response);      
          }; 
         } 
        }); 
        e.preventDefault(); 
       }); 
      }); 
    </script> 
<?php 
    } 
    echo "</table>"; 
} 
?> 

AJAX、PHPのページには、次のコードを使用してテーブルを返します。編集?エントリを削除するために、各行に別のフォームを追加してから、その行を動的に削除する必要がありますが、これらのフォームを送信できないままここにいます。

この生成されたフォームはウェブサイトではよく表示されますが、ビューソースには表示されません。クロムブラウザを使用しています。私はどんな提案にも開放的です。読んでいただきありがとうございます。私は真剣に私がここで解決策を見つけることを願っています。そうでなければ、私はこのソフトウェアの90年代に戻ります。

+0

)(e.preventDefaultを使用し提出からフォーム自体を停止することは、私の質問に何か問題はあります私は答えが得られていないのですか? – hasherfer

+0

私は皆さんに助けてくれてありがとう、私の質問に答えようとしているのはユーザーvbudoだけだと思われますので、私はそれを返信としてマークし、彼にアップポットします。そして私はただ隠れることに戻るでしょう。 – hasherfer

答えて

0

あなたは1つのIDだけを送信しているため、機能しません。それぞれのフォームを同じクラスにする必要があります。したがって、クリックされたフォームはすべて処理されます。同様

<form class="myForm" ..... 

その後、jQueryが、その後、この

$(".myForm").submit(function(e){ 
var inputToChange = this.varval; // saw input varVal, but use whatev 
var dataToChange = inputToChange.value; 
// then send the data to php for processing using ajax or post 

ように見えるあなたが好きな新しい価値あなたがなど、フォームの入力または他のdiv/TDに入れたいinputToChange.value =を使用します変更する。あなたが入力されていないデータを変更したい場合は、単にそのTDテキスト入力にし、クライアント

<input type="text" name="lname" disabled> 
その後、

コールバックにthis.lname.valueするための新しいデータを送信することにより、編集されているから、それを無効にします=

を(だけでなく、これを行うために他の多くの方法が)忘れないでください、あなたはAJAXを通じて送信した場合、あなたがそう

+0

あなたの答えをありがとう。ちょうどそれを試みたが、まだ何も得ていない。エラーでもありません。最初はそれを試してみましたが、何百行もありましたが、どのフォームにもフォームが混ざっていないことを確認する必要があると思っていました。 – hasherfer

+0

Jqueryを含めましたか?一般的な監視.... – Vbudo

+0

申し訳ありませんが、送信する必要があります...私は編集します – Vbudo

関連する問題