无需使用parsley.js即可使用提交按钮进行验证

Question

I want to use all the built in feature of parsley.js which is just specifying "required" in the tag like:

<asp:DropDownList ID="ddlmyid" runat="server" required>

The validation occurs after you would normally click on submit button and it validates. There is a popup message at the error which I like.

On my form I have a button that calls a server side function:

<asp:LinkButton ID="btnSaveUpdate" runat="server" Text='Save' CommandName="SaveUp"
                            OnClick="SaveUpdate" Style="float: right;" />

1. What is the best way to validate the form then call a server side function to process everything into the database
2. How can I integrate the normal form checking with this server side function call, instead of having to use the "submit" button? I want it to validate the entire form when I click on the button that calls the server function.
3. I don't want to have to specify another type of error message and just use the default that came with Parsley. A few examples I have seen having to specify the message all over again with a div.

Can I have a dummy submit button and call the onclick event, before calling my server side button event? Not sure how to do that...

thanks

Partial Solution to What I am looking for:

I am trying to implement this in a SharePoint webpart which poses additional challenges.
1. Registering the form with Parsley - Since it's in a SP web part which has a master page template, any local form tag gets removed since there is a master form tag called "aspnetForm". However, registering the form "aspnetForm" didn't seem to work too well. I even tried to specify clientmodeid="static" so the form does get removed and then register the local form id, but Parsley can't seem to find this either. Lastly, I found this site: http://vogtland.ws/markedwardvogt/?p=1142 which shows it register it with "form". Not sure why that works, but it does.

2. Then I use this very basic validation for parsley and change the function a little bit from the site mentioned above.

    <script type="text/javascript"> function customValidation() { $('form').parsley(); if (!($('form').parsley().validate())) { alert("form is not valid2"); } else { alert("form is valid2"); } } </script> 

3. The validation give an error message underneath the fields. But I want to use the nicer built in pop up message...does anyone know how I can do that?

Answer 1

I've never used parsley.js - but they have to offer a way to perform validation manually (not from clicking submit). OnClientClick attribute can be used to call a function in javascript before callin ganything in the server;

<asp:LinkButton ID="btnSaveUpdate" runat="server" Text='Save' CommandName="SaveUp" 
         OnClientClick="validateForm();" OnClick="SaveUpdate" Style="float: right;" />

then something like

<script type="text/javascript">
function validateForm(){
  // parsley.js has this function from their docs
  // it prevents submission if not valid
  validate(group, force)

}

</script>