限制<form:select>从数据绑定到modelAttribute如果选择了特定的<form:option>

问题描述：

我有一个产品类别的下拉菜单，它显示了数据库中的一组值。限制<form:select>从数据绑定到modelAttribute如果选择了特定的<form:option>

为此，我使用Spring标记。我希望其中一个选项显示一个名为“Others”的值，当选择该值时，我显示一个文本框以接受新的产品类别。

问题是当我提交表单时，product_category被设置为“Others，（新增类别）”。但我真正想要的只是新增的类别。

有没有办法做到这一点？

我的代码如下：

add.jsp

<form:form action="${actionURL}" method="POST" modelAttribute="Record"> 

.................. 
.................. 

           <div class="row"> 
           <section class="col col-4"> 
            <label class="label">Product Category</label> <label 
             class="select"> <form:select id="product_category" 
              path="product_category" onchange="add_new_productCategory();"> 
              <form:option value="">Choose category</form:option> 
              <form:options items="${productOptions}" 
               itemValue="product_category" itemLabel="product_category" /> 
              <form:option itemLabel="Others" value="Others"/>   
             </form:select><i></i> 
            </label> 
           </section> 
           <section class="col col-4"> 
            <label class="label">New Category</label> <label class="input"> 
             <form:input type="text" path="product_category" 
              id="new_product_category" disabled="disabled" required="required" /> 
            </label> 
           </section> 
          </div> 

............................ 
................... 

<input type="submit" value="Submit" class="button"> 

.............................

我使用下面的脚本

function() { 
      if ($("#product_category").val() == 'Others') { 
       $('#new_product_category').prop('disabled', false); 
      } else { 
       $('#new_product_category').prop('disabled', 'disabled'); 
      } 
     };

当 “其他” 选项被选中

这是越来越执行

在我的模特班里，这只是一般的过程，比如

@Column(name = "PRODUCT_CATEGORY") 
private String product_category;

在我的控制器我有

@RequestMapping(value = "/add.html", method = RequestMethod.GET) 
public String getRegisterPage(Model model) { 
    System.out.println("-----------------add records ---------------------"); 

    model.addAttribute("Record", new RecordParams()); 

    List<ProductCategory> productOptions = listProductParamsService.findProductCategories(); 
    model.addAttribute("productOptions", productOptions); 
    return "add"; 
}

和

@RequestMapping(value = "/add.html", method = RequestMethod.POST) 
public String saveRecord(@ModelAttribute("Record") RecordParams recordParams) { 
    System.out.println(recordParams); 
    RegisterService.addRecord(recordParams); 
    return "redirect:/add.html"; 
}

一切都按预期工作除了产品类别，其在打印时被显示为

RecordParams [id=null,................., product_category=Others,IPTL,....]

我该怎么做才能纠正他的，请帮忙？

在此先感谢。

答

如果我明白你的问题，尝试做如下建议，这可能会帮助您：

如果你想提交单product_category，
禁用product_category和使new_product_category如果product_category值Others和反之亦然...

function() { 
    if ($("#product_category").val() == 'Others') { 
     $('#product_category').prop('disabled', true); // disabled 
     $('#new_product_category').prop('disabled', false); 
    } 
    //else { 
     //$('#new_product_category').prop('disabled', 'disabled'); 
     // $('#product_category').prop('disabled', false); 
     // $('#new_product_category').prop('disabled', true); //disabled 
    //} 
};

这里一旦你已禁用product_category你不能改变它的值，否则部分是没用的，
要再次启用它，写focusout或new_product_categoryblur另一个函数，如果它的值是""即BLANK

更新：
另一种方法是，检查$('#product_category').val()表格提交。如果是Others则禁用它。
不要忘记将要求的属性添加到true$('#new_product_category')。

这是不能做的，不是一个好的做法。如果我禁用了product_category选择框，那么如果用户不小心点击了“Others”并想要选择其他选项，用户将如何返回并选择其他选项？ – eccentricCoder

如果用户点击'Others'只是'$（'＃new_product_category'）。focus（）'，并为此元素写入'focusout'，如果任何人将它留作**空白**再次启用'$（'＃product_category '）' –

检查更新并在Form上提交您的逻辑提交 –

答

感谢所有帮助过我的人。我发现了一个更好的方法。

我在我的模型

@Transient 
private String select_product_category;

推出一个新的领域，然后保存所选择的值到该区域，当它的价值被发现空

我做了以下修改设置这个值PRODUCT_CATEGORY码。

<form:form action="${actionURL}" method="POST" modelAttribute="Record"> 

.................. 
.................. 

          <div class="row"> 
          <section class="col col-4"> 
           <label class="label">Product Category</label> <label 
            class="select"> <form:select id="product_category" 
             path="select_product_category" onchange="add_new_productCategory();"> 
             <form:option value="">Choose category</form:option> 
             <form:options items="${productOptions}" 
              itemValue="product_category" itemLabel="product_category" /> 
             <form:option itemLabel="Others" value="Others"/>   
            </form:select><i></i> 
           </label> 
          </section> 
          <section class="col col-4"> 
           <label class="label">New Category</label> <label class="input"> 
            <form:input type="text" path="product_category" 
             id="new_product_category" disabled="disabled" required="required" /> 
           </label> 
          </section> 
         </div> 

............................ 
...................

在我的模型类我做了以下修改

@Transient 
private String select_product_category; 

@Column(name = "PRODUCT_CATEGORY") 
private String product_category; 

----------------------------- 


    public String getSelect_product_category() { 
    return select_product_category; 
} 

public void setSelect_product_category(String select_product_category) { 

    if (!select_product_category.equals("Others")) { 
     setProduct_category(select_product_category); 
    } else { 
     this.select_product_category = select_product_category; 
    } 
} 

public String getProduct_category() { 
    return product_category; 
} 

public void setProduct_category(String product_category) { 
    if (product_category.equals(null)) { 
     this.product_category = getSelect_product_category(); 
    } else { 
     this.product_category = product_category; 
    } 
}

现在，它的工作完美。

限制从数据绑定到modelAttribute如果选择了特定的

相关推荐