Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 678
  • Last Modified:

Jquery Validate Html.DropDownListFor Not Working?

I use the following code to successfully validate Html.EditorFor and Html.TextBoxFor. I cannot validate the Html.DropDownListFor. It gets ignored on submit button click, Help.

$("#form1").validate(
            {
                rules: {
                    'Vendor.Name': {
                        required: true
                    }
                },
                'Vendor.VendorTypeID':
                    {
                        notEqual: "-select-"
                    },

                messages:
                    {
                        'Vendor.Name': { required: " Required!" },
                        'Vendor.VendorTypeID': " Required!"
                    },

                success: function (label) {
                    label.html('OK').removeClass('error').addClass('ok');
                    setTimeout(function () {
                        label.fadeOut(500);
                    }, 1000)
                }
            });

Also noticed something strange about Jquery and the Html.DropDownListFor. The following code either returns 'undefined' for blank alert box.

 $('#form1').bind('submit', function ()
 {
     alert($('#Vendor.VendorTypeID').val()); //returns 'undefined'

     alert($('#Vendor.VendorTypeID').text()); //returns ''
  });


[Form - View Source]
<form action="/Vendor/New" id="form1" method="post">                
       <select  id="Vendor_VendorTypeID"
               name="Vendor.VendorTypeID">
                    <option value="">-select-</option>
                    <option value="1">Auto Service</option>
                    <option value="12">Bank</option>

      <input type="submit" value="Save" />
</form>
0
WorknHardr
Asked:
WorknHardr
  • 4
  • 4
1 Solution
 
Jitendra PatilSr.Software EngineerCommented:
hi

i think you need to put a value to option value of select as below.
<option value="-select-">-select-</option>

as per the jquery code you are checking the value as "-select-" which is not there in your option value and that's why it may be not working.

hope this helps
0
 
WorknHardrAuthor Commented:
Q. Why does .text return a blank alert window?
0
 
Jitendra PatilSr.Software EngineerCommented:
your are trying to acces the control by its name,why don't your try with the id you are specifiying i mean to say "Vendor_VendorTypeID".
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
WorknHardrAuthor Commented:
Okay, you're correct about using _ underscore with a Html.DropDownListFor

Note: I still need to use the . for the Html.EditorFor

Anyway, new problem: I cannot see error message for DropDownListFor

I do think the validation is working because it halts the Action from being called and the JQuery ' submitHandler' returns it's alert.

[Current Code]
 $(function () //onload
    {
        jQuery.validator.addMethod('NonEmpty', function (value) {
            return ($("#Vendor_VendorTypeID option:selected").text() != '-select-');
        }, '');

      $("#form1").validate(
            {
                rules: {
                    'Vendor.Name': {
                        required: true
                    }
                },
                'Vendor_VendorTypeID':
                    {
                        required: true,
                        NonEmpty: false
                    },

                messages:
                    {
                        'Vendor.Name': { required: " Required!" },
                        'Vendor_VendorTypeID': { NonEmpty: " Required!" }
                    },

                submitHandler: function (form) {
                    alert('valid form submitted');
                    return false;
                },

                success: function (label) {
                    label.html('OK').removeClass('error').addClass('ok');
                    setTimeout(function () {
                        label.fadeOut(500);
                    }, 1000)
                }
            });
0
 
Jitendra PatilSr.Software EngineerCommented:
hi

if you have added   <option value="--select--">-select-</option> in the markup then the option value will never be empty. you need to check it with the value of the dropdown
if it says --select-- then say its false  and the value is required else ok to go.

try to change the validation code for
 'Vendor_VendorTypeID':
                    {
                        required: true,
                        NonEmpty: false
                    },

HTH!
0
 
WorknHardrAuthor Commented:
I was over-thinking the DropDownFor validation. Here's my simple solution:

[New Code]
 $(function () //onload
    {
      $("#form1").validate(
            {
                rules: {
                    'Vendor.Name' : {
                        required: true
                    }
                },
                'Vendor.VendorTypeID' : {
                        required: true
                    },

                messages:
                    {
                        'Vendor.Name': {
                                required: " *"
                         },
                        'Vendor.VendorTypeID': {
                                required: " *"
                         }
                    },

                success: function (label) {
                    label.html(' ').removeClass('error').addClass('ok');
                    setTimeout(function () {
                        label.fadeOut(500);
                    }, 1000)
                }
            });
0
 
Jitendra PatilSr.Software EngineerCommented:
so i think you managed to get it work, good.
0
 
WorknHardrAuthor Commented:
Thx for helping me along
0

Featured Post

Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

  • 4
  • 4
Tackle projects and never again get stuck behind a technical roadblock.
Join Now