0

Here is my problem :

i have a huge form, which is made from Bootstrap template, so, structure looks like this :

<form ...>

<span -container->
    <span -title->
        toggle click, title
    </span>
    <div class="row" -bootstrap->
        ...
            <input name="x" required type="text"/>
        ...
    </div>
    <div -another row->
    </div>
    ...
</span>
<span -another container->
</span>

</form>

AS i use the "required" property, when i submit the form, if the form isn't posted... it's ok, BUT it shows a message, just under the concerned input (which is not complete).. it's still great... BUT the problem is, IF the concerned input is in an already toggled part... (i mean hidden when the user tries to submit), the error is NOT shown (sure! cuz' the container is hidden!!), but it's a problem... to me... because i'd like to show where is the incomplete field, even if it is "hidden" on submit... how can i do?

i thought about creating a "tips" div, next to the submit button, which would show a text error message explaining which input isnt completed... but even this, i really don't know how to do... the submit click automatically points to the error... how can i get, with a variable, the missed field name or id?

my english is not perfect, i'm sorry if my question is not clear... but, anyway, thanks for help!

Edit : i forgot to mention that the "toggle" just toggles the ".row" elements in a container... (my inputs are in ".row")

Julo0sS
  • 2,096
  • 5
  • 28
  • 52
  • 1
    Disable the hidden validators? What validation library are you using? – Esko Jun 30 '14 at 11:33
  • i use the validation included in bootstrap, it's useful when your inputs are shown, a small message appears under the empty fields (or error ones if i add constraints such as "email" and so on...) but it's hidden with the fields when they are toggled... – Julo0sS Jun 30 '14 at 11:43
  • Does the bootstrap include jQuery.Validation library? If it does you need to make condition when the validation is required and when it is not see here http://stackoverflow.com/questions/19543354/jquery-validate-set-conditional-rules-based-on-user-selection – Esko Jun 30 '14 at 11:56
  • well, idk if it is really bootstrap or just jquery, i have some JS files from bootstrap, and JQ 1.10.2 included in my project... i "don't" use some special code to make the validation in fact, i just add "required" in my input fields and "something" does the job :P so i do not need to code my own validation functions since it works fine like this... but now, i have made a form where i can hide parts... and if these parts are not completed this "error" message (automatic) is not shown neither... – Julo0sS Jun 30 '14 at 12:02
  • i may say that this way to make it with bootstrap is somehow very interesting and easy since i just have to add "required" in my inputs (i have no rules to write, if i check a checkbox, i add or remove required where it is needed with jquery) but never thought about that "toggle" trick before... – Julo0sS Jun 30 '14 at 12:11
  • 1
    The magic in a ready made package can only take you so far :) I'm pretty sure that what you need requires you to code a few lines of javascript for it to work. – Esko Jun 30 '14 at 12:29
  • well, i'm working on it... i think i'm gonna make a 2nd system, completing the 1st one, on "binding" keyup and input on the required fields which will display in a special color the title of the container... so the user can easily see where the problem is... what do you think about this? – Julo0sS Jun 30 '14 at 13:02

0 Answers0