开发者

JavaScript validation issue

开发者 https://www.devze.com 2023-03-25 17:26 出处:网络
I have following requirements: Get questions from db in servlet. Display themin jsp. Check if question is mandatory or not.

I have following requirements:

  1. Get questions from db in servlet.
  2. Display themin jsp.
  3. Check if question is mandatory or not.
  4. If question is mandatory then answer to that is reuired at the time of submiting form and if no answer is provided for the question then don't submit form and display warning.

Up to number 3 I have done it. But don't know how to go about number 4. How can I check this in javascript. As number of questions are not fixed as they are coming from database. Also how many of them are mandatory is also not fixed. How to go for this?

What value should I check in javascript? How can I know that which questions are mandatory in javascript once they are displayed in page?

---- Edit

This is how my data is displayed on jsp:

for (Question question : questions) {%>
    <tr>
    <td><b><%= question.getDefination() %></b>
    <table style="margin-left: 25px;">
<%
    int type = question.ge开发者_StackOverflowtType();
    List<Option> options = question.getOptions();
    for(Option option: options){%>
        <tr>
            <% if(type == 2){ %>
                  <td><input type="radio" name="<%=question.getIdQuestion() %>" value="<%= option.getIdQueOption() %>" /><%= option.getOptionName() %></td>
            <%} else if(type == 1) {  %>
                  <td><input type="checkbox" name="<%=option.getIdQueOption() %>" value="<%= option.getIdQueOption() %>" /><%= option.getOptionName() %></td>
            <%} %>
        </tr>
    <%}%>
</table></td></tr>
<%}%>

--- Edit 2 Sample page will look like this:

JavaScript validation issue


I'd suggest doing it like nnnnnn also suggested: add a class to all mandatory questions, so that you'd be able to identify them from optional questions. Then you'd need some Javascript that looks up the mandatory questions (I suggest using jQuery for simplicity).

Let's say that you have class="mandatory" on every mandatory question's tr element.

function onSubmit(e) {
    // Set the default result to be successful
    var allFilled = true;
    // Get all mandatory rows
    var mandatory = $('tr.mandatory');

    // Loop through each matching element
    mandatory.each(function(i, question) {
        var answer = $(question);

        // Find all elements that are checked and if none is found, 
        // the question must be unanswered
        if (answer.find('input:checked, input[type="text"][value!=""]').length === 0)
            allFilled = false;
    });

    // If the default value "true" was changed, there must be empty answers
    if (!allFilled)
        e.preventDefault();
}

Of course you'd have to bind the onSubmit function to submit event on the form you are checking.

BTW, I don't think having a table inside a table is valid HTML, but I'm not sure.

0

精彩评论

暂无评论...
验证码 换一张
取 消