Question

我有一个javascript var，它返回输入文本ID“ven_prod”的值，值为“ven_prod”我需要在我的数据库中进行搜索而不提交页面。

我不能在java代码中使用javascript var，所以我在隐藏的输入文本ID“prod_hidden”中设置了值，但我需要提交它以获取java代码的值并使其成为搜索...我该怎么做？

<input id="ven_prod" type="text" placeHolder="Código de Barras" autofocus>
        <input id="prod_hidden" type="text" value="">

        <script>    
            $('#ven_prod').keypress(function (e)
                    {
                        if(e.keyCode==13)
                        {
                            var table = document.getElementById('tbprodutos');
                             var tblBody = table.tBodies[0];  
                             var newRow = tblBody.insertRow(-1);
                             var prod = document.getElementById('ven_prod').value;
                             var qtd = document.getElementById('ven_qtd');
                             var barra = prod.substring(0, 12);
                             var num = prod.substring(14, 16);
                             document.getElementById('prod_hidden').value = barra;
                             var ref = <%=pd.getProdutosBarra(request.getParameter("prod_hidden")).getPro_referencia()%>;
OR
                             var ref = <%=pd.getProdutosBarra(JS VAR 'barras HERE).getPro_referencia()%>;

                             if(prod.length==16) { 
                               var newCell0 = newRow.insertCell(0);  
                               newCell0.innerHTML = '<td>'+ref+'</td>';

                               var newCell1 = newRow.insertCell(1);  
                               newCell1.innerHTML = '<td>'+num+'</td>';  

                               var newCell2 = newRow.insertCell(2);  
                               newCell2.innerHTML = '<td>'+qtd.value+'</td>';

                               var newCell3 = newRow.insertCell(3);  
                               newCell3.innerHTML = '<td>R$ '+valor+'</td>';

                               var newCell4 = newRow.insertCell(4);  
                               newCell4.innerHTML = '<td>'+barra+'</td>';

                                document.getElementById('ref').value = '6755';
                                document.getElementById('imgsrc').src = './?acao=Img&pro_id=1';
                                document.getElementById('valortotal').value = 'Testando novo valor';
                                document.getElementById('ven_prod').value = '';
                                document.getElementById('ven_qtd').value = '1';

                            } else {

                                document.getElementById('ven_prod').value = '';
                                document.getElementById('ven_qtd').value = '1';
                                alert("Código de barras inválido!");
                            }

                            return false;
                        }
            });
        </script>

Answer 1

你可以使用jQuery进行ajax调用，如下所示。将提交您的表单数据以及隐藏元素。

var form = jQuery("#YourFormID");
jQuery.ajax({
        type: "POST",
        url: form.attr("action"), 
        data: form.serialize(), // serializes the form's elements.
        success: function(data) {
            console.log(data);
        }
});

Answer 2

a）您可以这样使用：

$("#pro_barras").bind("change paste keyup", function() {
   //$('.someClass').submit();    
   $('#it_is_form_id').submit();   // it call form's submit function
});

输入文本更改时检测到的代码段。要了解更多信息，请参阅here如果您要自定义form submit功能

$('#it_is_form_id').bind("submit", function(){
  //alert("submit");
  // make here simple ajax query
  return false; //<-- it is used so that default submit function doesn't work after above code. 
});

别忘了，所有代码都在里面

<script>
  $(function() {
   // your code must be here
  });
</script>

b）如果您不想使用form，可以这样做：

<script>
    $(function() {
        $("#pro_barras").bind("change paste keyup", function() {     
            var text = $("#pro_barras").val();
            $.ajax({
                type: "POST",
                url: "yourUrl",
                data: text,
                success: function(res){
                    console.log(res);
                },
                error: function(err){
                    console.log(err); 
                }
            });
        });

    });
</script>

制作简单的ajax查询：

Answer 3

名为＆＃34; pro_barras＆＃34;
的输入文本的值

你确定吗？看看这个：

<input type="hidden" id="pro_barras">

它不是输入的名称，而是ID。您可以尝试使用它：

<input type="hidden" name="pro_barras">

现在，您可以使用$.ajax将请求发送到新页面，您将在该页面中请求数据库中的数据。然后，您将编写响应，并将其恢复到第一页。

它的作用取决于你如何使用它。我将尝试让您简单地使用jQuery API的serialize()方法，这将允许您使用表单中的数据创建一个简单的URL参数，将其用作：

$.ajax({
  var data = $('#formid').serialize(); // serialize the form..
  url: "link/to/file.cshtml",
  data: data,
  success: function (datares) {
    $('#resultid').html(datares); // write the result in the element
  }
})

如果您只想获取该字段的值，可以使用

var data = $('input[name=pro_barras]').val();

没有提交页面。

单击input type="submit"按钮时，必须提交您的页面。为了防止你可以使用

$('#idofsubmitbutton').click(function () {
  return false; // stop execution and stay on page..
}

然后ajax将继续，其他方法是删除input type="submit"并使用<button></button>，但不会导致任何提交。

使用java代码获取值

这不是java :)它的JavaScript，它们完全不同。 :)

Answer 4

您还可以在输入元素中添加自定义属性（在Jquery中）：

<input type='text' id='pro_barras' customattr='myCustomInfo'/>

<script>
 var customValue = $('#pro_barras').attr('mycustomvar');
alert(customValue);
</script>

Fiddle

隐藏的输入文本使用jquery提交

4 个答案: