首页 > 解决方案 > 为什么输入的值不是由 javascript 设置的?

问题描述

html 部分是产品的创建视图。因此,用户可以根据需要添加任意多的产品线。html部分是添加一行的按钮,id为tat的div应该保留产品的创建形式。javascript 部分是在单击按钮时添加 html 部分的代码,以及获取值、访问数据库并获取另一个数据并将其显示在另一个输入中的部分。

因此,代码应该:

  1. 从 select[name="product[]"] 中获取值(即用户感兴趣的产品的 id);

  2. 在数据库中找到该产品并在 input[name="unitinput"] 中显示其单价。

代码如下。为什么它是错误的以及如何做到这一点?类 Product 通过 ProductController 中的方法传递给视图。在我尝试在脚本中使用 @foreach 之前,它没有成功。

如何使用 javascript 根据所选选项设置另一个输入的值并从数据库中获取数据?还是有其他方法可以做到这一点?我在这部分打了一个问号,因为根据这个问题的评论,我那部分是错误的。

// add new line
  $("#add").click(function(){
    idModNova = autoInc(idModNova);

    var input ='<div id="product-'+idModNova+'"><select class="form-control" id="Product" id_mod_nova='+idModNova+' name="product[]" required><option disabled selected>Select product</option>@foreach($products as $product)<option value="{{$product->id}}">{{$product->name}}</option>@endforeach</select></div>';
    
    input += '<div form-group" id="unit-'+idModNova+'"><div class="input-group"><div class="input-group-prepend"><span class="input-group-text">$</span></div><input name="unitinput" type="number" step=".01" class="form-control value" id="unitinput" id_mod_nova='+idModNova+' value="0.00" readonly></div></div>';

    $("#form").append(input);
    return false;
  });

  // TRYING TO GET AND SET THE VALUE      
  $(document).ready(function() {
      $('#Product').attr('id_mod_nova').change(function() {
        var valorselect = $(this).val();
        if (valorselect == "?") {
          $('#unitinput').attr('id_mod_nova').val("?");

        }
      });
  });
<div class="row" id="form"></div>

          <div class="row">
            <div class="col-md-4">
              <button type="button" class="btn btn-success" id="add" style="margin-bottom: 32px">Add New Line</button>
            </div>
          </div>

标签: javascripthtmllaravel

解决方案


  • @foreach正在使用您的 JS 修改服务器(或其他)模板渲染代码 - 它永远不会像您预期的那样运行。如果您从 client-js 渲染,请直接传递 JS 对象或 JSON。
  • $("#adicionar").click在您的就绪函数之前声明,并且根据加载顺序可能甚至不在那里绑定

总体而言,您似乎在以一种不正常的方式混淆服务器和客户端代码。你不想以你拥有的方式将两者混合在一起。


推荐阅读