CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Metaphor
Metaphor

Reputation: 374

Grouping some fields in html form

In HTML form we can use class attributes to group some input fields (like: TextBox,DropDownList).

Example: 

@Html.TextBox("MailingCity", null, new { @class = "block" })
@Html.DropDownList("MailingStateID", new SelectList(ViewBag.stateList, "value", "text"), new { @class = "block", @id = "ddlMailingStateList" })

After that we could work at script for all the fields by class.

Example:

$('.block').each(function () {

            var default_value = this.value;
            $(this).focus(function () {
                if (this.value == default_value) {
                    this.value = '';
                }
            });
            $(this).blur(function () {
                if (this.value == '') {
                    this.value = default_value;
                }
            });
        });

Is there any other possible way to group some field without class? Actually, I want to write a common validate function at script section which will cover some input fields.

Thanks in advance.

Upvotes: 1

Views: 610

Answers (3)

Metaphor
Metaphor

Reputation: 374

Well, Finally I did it with html custom attribute. Details:

At HTML:

@Html.TextBox("MiddleName", null, new { @class = "block", @myAtt="valid" })

At Script:

 $('[myatt="valid"]').each(function () {
            $(this).focus(function () {
                alert("Working...");
            });
            $(this).blur(function () {
                alert("Seriously?");
            });
        });

Here I use @myAtt="valid". And it's working well :)

Upvotes: 1

vijayP
vijayP

Reputation: 11502

in that case i will suggest to take a look at jQuery(":input");

this will give you all fields irrespective of text,select, button, textarea and so on. JQuery Documentation link link

Upvotes: 0

vijayP
vijayP

Reputation: 11502

you can group fields by type selector. for example:

$('input[type=text]').each(function () {}).

above line will give you all input fields having type equal to text. Similar logic you can apply to get all checkboxes, select boxes and so on.

for more example of jquery selector go to link JQuery Selector

Upvotes: 0

Related Questions