Question

我有一个产品类别的下拉列表，它会显示数据库中的一组值。

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

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

有没有办法做到这一点？

我的代码如下：

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,....]

我该怎么做才能纠正这个问题，请帮帮忙？

提前致谢。

Answer 1

如果我理解了您的问题，请尝试执行以下建议，这可能会对您有所帮助：

如果您想提交单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或blur new_product_category上编写另一个函数，如果其值为""，即 BLANK

<强>更新：
另一种方法是，在表单提交上检查$('#product_category').val()。如果Others禁用它。
不要忘记为true添加$('#new_product_category')所需的属性。

Answer 2

感谢所有帮助过的人。我找到了一种更好的方法。

我在模型中引入了一个新字段

@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;
    }
}

现在它完美运作。

如果选择了特定的<form：option>，则将<form：select>从数据绑定限制为modelAttribute

2 个答案: