如何创建一个jQuery nTier选择比较脚本？ [英] how do I create a jQuery nTier select compare script?

问题描述

我正在使用jQuery尝试创建匹配/不匹配警报。基本上，我有一个nTier系列的下拉列表和输入字段。

I am working with jQuery on trying to creating a match/mismatch alert. Basically I have an nTier series of drop downs and input fields.

如果用户放下选择并选择一个值，该值匹配另一个选择组下拉列表。然后我需要去比较价格和perCase值，并确保有匹配。

If a user drops down the select and chooses a value and that value matches another select group drop down. I then need to go and compare the price and perCase values and make sure there is a match.

如果价格不匹配，我需要生成警报。 ..如果情况不匹配，我需要生成一个警报。

If the prices don't match, I need to generate an alert...If the cases don't match I need to generate an alert.

我可以做两个，但我需要这个聚合和坚持超过nTier的选择/价格/案例组，我很困惑如何做到这一点。

I can do two, but I need this to aggregate and persist over an nTier amount of select/price/case groups and I am getting confused on how to do this.

这是我正在使用的清理过的简化表单。

Here is a cleaned up simplified form that I am working with.

<form name="form1" ID="form1">
<table>
<tr>
<td>
    <select name="selectA">
        <option id="A" value="">None</option>
        <option id="A" value="A">A</option>
        <option id="A" value="B">B</option>
        <option id="A" value="C">C</option>
    </select>
</td>
<td>
    <input id="priceA" type="text" name="price" value="8.99">
</td>
<td>
    <input id="perCaseA" type="text" name="perCase" value="4">
</td>
</tr>
<tr>
<td>
    <select name="selectB">
        <option id="B" value="">None</option>
        <option id="B" value="A">A</option>
        <option id="B" value="B">B</option>
        <option id="B" value="C">C</option>
    </select>
</td>
<td>
    <input  id="priceB" type="text" name="price" value="8.99">
</td>
<td>
    <input  id="perCaseB" type="text" name="perCase" value="4">
</td>
</tr>
</table>
</form>

推荐答案

我确定这应该是可能的，只是使用jQuery选择器，但不完全。啊好。 :)

I was sure this should be possible just using jQuery selectors, but not quite. Ah well. :)

这将选择所有 select 元素，然后通过检查它们的值来触发 select （显然 xxx [value =xx] 不适用于 c $ c>）。然后过滤在匹配 select s（价格文本框）后面的输入，以确保它没有与触发 输入相同的值。如果你仍然得到匹配，你有不一致，需要警报。

This selects all of the select elements and then filters then by checking their values against the triggering select (apparently xxx[value="xx"] doesn't work for select). The input following any matching selects (the price textbox) is then filtered to make sure it doesn't have the same value as the triggering select's following input. If you still get matches, you have an inconsistency and need an alert.

由于表格的原因，不幸的是需要使用相当丑陋的 parent（）。next（）。children（）

The rather ugly parent().next().children() is unfortunately needed because of the table.

你需要一个类似于每个case的代码，um，case。我不认为你可以立即检查两个不幸的是。

You'll need an analogous bit of code for the per case, um, case. I don't think you can check both at once unfortunately.

$("select").change(function ()
{
    var $this = $(this);

    if ($("select").filter(function () { return $(this).val() == $this.val(); }).parent().next().children("input[value!='" + $this.parent().next().children("input").val() + "']").length != 0)
    {
        // alert
    }
});

这篇关于如何创建一个jQuery nTier选择比较脚本？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！