2011-07-27 10 views
1

正しい結果を得るために、結果をフォームに入力するためのヘルプが必要です。グリッドの結果をフォームに入力する

私はflexigridを使用していて、行から詳細を取得して変数に保存するコードを持っています。

私が立ち往生している点は、編集のためにこれらの詳細を表示したいという形もあります。結果はvar '列'にあります。私の人生にとって、私はそれをする方法を見ることができません。

結果がフォームに入ると、jQueryはこれらの結果を処理のためにdbに渡します。

私はすべてのコードを持っていますが、あなたの注意のためにどの部分を投稿するかはわかりません。可能であれば、私がここに示したいコードに基づいてこれを行う方法を誰かに教えていただければ幸いです。

これは、グリッドからデータを収集するために使用されます。データをキャプチャするための

function editbox(com, grid) { 
    if (com == 'Edit') { 
     if ($('.trSelected').length > 0) { 
      var items = $('.trSelected'); 
      var itemlist = ''; 
      for (i = 0; i < items.length; i++) { 
       itemlist += items[i].id.substr(3); 
      } 
      var id = $("tr.trSelected td:nth-child(1) div").text(); 
      var location = $("tr.trSelected td:nth-child(2) div").text(); 
      var customer = $("tr.trSelected td:nth-child(3) div").text(); 
      var address = ($("tr.trSelected td:nth-child(4) select :selected").text() == "Select an Address") ? "" : $("tr.trSelected td:nth-child(4) select :selected").text(); 
      var service = ($("tr.trSelected td:nth-child(5) select :selected").text() == "Select a Service") ? "" : $("tr.trSelected td:nth-child(5) select :selected").text(); 
      var department = $("tr.trSelected td:nth-child(6) div").text(); 
      var status = $("tr.trSelected td:nth-child(7) div").text(); 
      var custref = $("tr.trSelected td:nth-child(8) div").text(); 
      var size = $("tr.trSelected td:nth-child(9) div").text(); 
      var authorisation = $("tr.trSelected td:nth-child(10) div").text(); 
      var intakedate = $("tr.trSelected td:nth-child(11) div").text(); 
      var destroydate = $("tr.trSelected td:nth-child(12) div").text(); 
      var columns = "id=" + id + 
          "&location=" + location + 
          "&customer =" + customer + 
          "&address=" + address + 
          "&service=" + service + 
          "&department=" + department + 
          "&status=" + status + 
          "&custref=" + custref + 
          "&size=" + size + 
          "&authorisation=" + authorisation + 
          "&intake_date=" + intakedate + 
          "&destroy_date=" + destroydate; 

      console.log(columns); 
      $("#boxeditform").dialog('open'); 
      //console.log(department+" "+custref+" "+address); 
     } else { 
      jAlert('you must select a row'); 
     } 
    } 
} 

HTML:

<form id="EB_edit" name="EB_edit" action="" method="post" class="webform"> 

    <label for="EB_status">Status:</label> 
    <select name="EB_status"> 
    <option SELECTED VALUE="">Select a Status</option> 
    <option value="In">In</option> 
    <option value="Out">Out</option> 
    <option value="Destroyed">Destroyed</option> 
    <option value="Permanent">Permanent</option> 
    </select><br /><br /> 
    <input id="EB_id" name="EB_id" type="hidden" value="" /> 
    <label for="EB_custref">Box Reference #:</label> 
    <input id="EB_custref" name="EB_custref" type="text" class="text ui-widget-content ui-corner-all inputbox EB_custref" value="" /> 
    <label for="EB_address">Address:</label> 
    <input id="EB_address" name="EB_address" type="text" class="text ui-widget-content ui-corner-all inputbox EB_address" value="" /> 
    <label for="EB_service">Service:</label> 
    <input id="EB_service" name="EB_service" type="text" class="text ui-widget-content ui-corner-all inputbox EB_service" value="" /> 
    <label for="EB_dept">Department:</label> 
    <input id="EB_dept" name="EB_dept" type="text" class="text ui-widget-content ui-corner-all inputbox EB_dept" value="" /> 
    <div id="f2"></div><br /> 
    <button id="EB_submit" class="submit">Submit</button> 
</form> 

目的はエディットボックス()VAR '列' からのデータでフォームを移入することです。

+0

いくつかのコードで質問を編集できますか?それが間違っている場所を正確に指摘してください。あなたの要求に応じて – JMax

+0

コードを追加しました。私は達成しようとしていることをコードで強調しました。おかげで – bollo

答えて

2

私はフレキシグリッドでスピードアップするつもりはありませんが、より良い方法が必要です!

これらの変数をすべて設定するのではなく、マッピングを作成してフォームに入力するのはなぜですか? val()がインテリジェントに<select>コントロールから選択した値をフェッチすることを

function editbox(com, grid) { 
    if (com == 'Edit') { 
    if ($('.trSelected').length > 0) { 

     var mapGridToForm = //Name   Child index Form id 
          [ ['id',    1,  'EB_id'  ], 
           ['location',  2,  '???'   ], 
           ['customer',  3,  '???'   ], 
           ['address',   4,  'EB_address', 'select'], 
           ['service',   5,  'EB_service', 'select'], 
           ['department',  6,  'EB_dept'  ], 
           ['status',   7,  'EB_status' ], 
           ['custref',   8,  'EB_custref' ], 
           ['size',   9,  '???'   ], 
           ['authorisation', 10,  '???'   ], 
           ['intakedate',  11,  '???'   ], 
           ['destroydate', 12,  '???'   ] 
          ]; 
     var baseNode  = $('tr.trSelected'); 

     $("#boxeditform").dialog('open'); 

     //--- Populate the form. 
     for (J = mapGridToForm.length - 1; J >= 0; --J) { 
     var row  = mapGridToForm[J]; 

     if (row.length > 3) { //--- It's a select control. 

      // NOTE: Normally, we use the `value` attribute for selects. 
      var gridVal = baseNode.find ('td:nth-child(' + row[1] + ') select:selected').text(); 

      //--- Blank the value if it's unselected 
      if (/^Select a/i.test (gridVal)) 
       gridVal = ""; 
      $('#' + row[2]).val (gridVal); 
     } 
     else { 
      //--- Get the value from the grid and set the form control with it. 
      var gridVal = baseNode.find ('td:nth-child(' + row[1] + ') div').text(); 
      $('#' + row[2]).val (gridVal); 
     } 
     } 
    } else { 
     jAlert('you must select a row'); 
    } 
    } 
} 


注:

はこのような何かを試してみてください。

+0

ブロッコありがとう、正直言って、それは私の頭の上に行く。 Javascript/jqueryの新しいシーンにかなり興味があります。 – bollo

+0

私はあなたのことを聞いて、私たちは皆どこかで始めました。コードを試してみて、何が起こるか見てみましょう。 –

関連する問題