Динамически передать ввод текста в HTML таблице функции Javascript

Я генерирующего HTML таблицу, как показано ниже:Динамически передать ввод текста в HTML таблице функции Javascript

var tablebody = ""; 

    $.ajax({ 
     type: "POST", 
     contentType: "application/json; charset=utf-8", 
     url: "mCatchmentMapping.aspx/BindDatatable", 
     data: "{}", 
     dataType: "json", 
     success: function (data) { 
      var struct = "<div class='message_list'><div class='module_content'>"; 

      for (var i = 0; i < data.d.length; i++) { 
       tablebody = tablebody + "<div class='message'><table id='tblhtml' width='100%'><tr><td width='25%'>" + data.d[i].Name + "</td>"; 
       tablebody = tablebody + "<td><input type='hidden' style='color: green;' id='txtCode' name='Code' size='5' type='number' value=" + data.d[i].Code + "></td>"; 
       tablebody = tablebody + "<td width='15%' class='nr' align='left' style='color:green'><input type='text' class='nr' style='color: green;' id='txtCatchment' name='txtCatchment' size='5' type='number' value=" + data.d[i].Catchment + "></td>"; 
       tablebody = tablebody + "<td width='15%' align='left' style='color:green'><input type='text' style='color: green;' id='txtSalesMonth1' name='SalesMonth1' size='5' type='number' value=" + data.d[i].salesMonth1 + "></td>"; 
       tablebody = tablebody + "<td width='15%' align='left' style='color:green'><input type='text' style='color: green;' id='txtSalesMonth2' name='SalesMonth2' size='5' type='number' value=" + data.d[i].salesMonth2 + "></td>"; 
       tablebody = tablebody + "<td width='15%' align='left' style='color:green'><input type='text' style='color: green;' id='txtSalesMonth3' name='SalesMonth3' size='5' type='number' value=" + data.d[i].salesMonth3 + "></td>"; 
       tablebody = tablebody + "<td width='15%' align='left' style='color:green'><input type='submit' class='use-address' id='btnSave' name='Save' onclick='saveData(" + data.d[i].Code + "," + $('#txtCatchment').val() + "," + $('#txtSalesMonth1').val() + "," + $('#txtSalesMonth2').val() + "," + $('#txtSalesMonth3').val() + ")'; value='Save'/></td></tr></table></div>"; 
      } 
      tablebody = tablebody + "</div></div>" 
      tablebody = struct + tablebody; 
      $("#tbDetails").append(tablebody); 
     }, 
     error: function (result) { 
      alert("Error"); 
     } 
    });

Каждая строка, которая имеет кнопку сохранить в последний тд. Если я нажму кнопку «Сохранить», соответствующее текстовое значение ввода строк должно быть передано как параметры функции JavaScript «saveData».

Это мой Javascript функция:

function saveData(code, catchment, month1, month2, month3) { 
    alert("storename :" + code); 
    alert("catchment :" + catchment); 
    alert("month1 :" + month1); 
    alert("month2 :" + month2); 
    alert("month3 :" + month3); 
    }

, когда я нажимаю сохранить, я получаю неопределенное значение для "водосбора", "MONTH1", "Month2" и "month3".

Как передать значение входного текста функции javascript?

источник

2016-09-12 thevan

проблем нет в креплении. Я могу связать таблицу html. Он имеет 16 строк. Я могу разрешить пользователю обновлять введенное текстовое значение, после изменения значения они нажмут кнопку сохранения. – thevan

Вам нужно дважды указать значение, потому что вы хотите передать строку, например: '' saveData ('"+ data.d [i] .Code +"', '"+ etc' –

таким же образом, если i pass "data.d [i] .Catchment" принимает, но если я передаю "$ ('# txtCatchment'). val()", он принимает как неопределенный – thevan

Вы создаете текстовые поля динамически, поэтому они не будут доступны при создании, но будут доступны на время выполнения, так что вы должны передать их как этот

tablebody = tablebody + "<td width='15%' align='left' style='color:green'><input type='submit' class='use-address' id='btnSave' name='Save' onclick='saveData(" + data.d[i].Code + ",$(\"#txtCatchment\").val(), $(\"#txtSalesMonth1\").val(),$(\"#txtSalesMonth2\").val(), $(\"#txtSalesMonth3\").val())'; value='Save'/></td></tr></table></div>";

Здесь есть аналогичный пример

https://jsfiddle.net/h553jzmb/

источник

2016-09-12 08:22:10

Этот файл не работает. Функция Javascript не звонит. – thevan

Попробуйте прямо сейчас! small typo –

Я получаю эту ошибку: Критическая ошибка JavaScript в строке 1, столбец 17 в (неизвестное местоположение источника) SCRIPT1002: Ошибка синтаксиса – thevan

Вместо этого использовать $ ('# txtCatchment'). Val использовать data.d [i] .Catchment и так далее. Поскольку #txtCatchment не будет уникальным после вашего цикла

Измените последнюю строку с функцией сохранения с помощью кода ниже.

tablebody = tablebody + "<td width='15%' align='left' style='color:green'><input type='submit' class='use-address' id='btnSave' name='Save' onclick='saveData(" + data.d[i].Code + "," + data.d[i].Catchment + "," + data.d[i].salesMonth1 + "," + data.d[i].salesMonth2 + "," + data.d[i].salesMonth3 + ")'; value='Save'/></td></tr></table></div>";

Работа живому пример https://jsbin.com/jayaki/edit?html,js,output

Надеется, что это помогает. Благодаря !

источник

2016-09-12 08:20:01 KrishCdbry

Динамически передать ввод текста в HTML таблице функции Javascript

ответ

Смежные вопросы