0

How can I achieve using JQuery Validation Plugin?

I have a form in SP2013. Need the following set of validations for two columns.

First Case:

Set Column 2’s default value based on value in Column 1. Column 2 default can change based on Column 1 value chosen

Second Case:

Set Column 2 as required (validation) only when Column 1 value equals this or this. Not all Column 1 values would make Column 2 required.

Can be using CEWP (Of JQuery) or either SP Designer. I'm new to customization in SharePoint.

2 Answers 2

0

Yes you can do this easily using j query.To my understanding to your requirements I am taking column 1 and 2 as follows:- ( an example)

For example in the following if we select others in country, the state and city columns will hide(Figure1).

Figure1:

enter image description here

But if we select any country name they will show :

enter image description here

We are hiding/showing the columns based on each-other using jquery in sharepoint. You can download the required files from here https://sputility.codeplex.com/ . Accordingly you can write logic for your requirements. Also you can use two web-parts for this purpose.

First is Script Editor : Easy to use just add it on your page, add relevant code to it and you are done. But this might make things a bit messy, as you have to do all editings in the script editor itself.

Second is CEWP (Content Editor Web Part) : I like this personally, just write the code in a notepad file and upload it into any document library. Now you can put the link of this file in the CEWP, for more help check Google a bit about it.

Note :- No matter which Web-Part you use remember to add reference of jquery library(jquery.js) and sharepoint jquery library(from codeplex), which you will have to upload to one of document library and from there you will have to add references in web-parts.

Here is my custom code for the above screenshots, you may have look here to get some more idea:

I had pasted this code in a script editor:

https://jsfiddle.net/ucyvyazo/

Please accept my answer if you feel satisfied with it.

1
  • How can I achieve it when users editing in "Quick Edit" Mode?
    – Nickhalden
    Commented Aug 11, 2016 at 17:35
0

Pseudo code, add the below to the list new and edit form using script editor webpart.

<script type="text/javascript" src="//code.jquery.com/jquery-1.12.0.min.js"></script>
<script type="text/javascript">
var column1Val;
$(document).ready(function() {
// First Case
$("select[Title='column1']").change(function() {
// check chosen value for ex = 'In Progress'
column1Val = $("option:selected", this).text();
if(column1Val === 'In Progress') {
    $("input[Title='column2']").val('set some value'); 
}
});

});

function PreSaveAction(){
// Second case  
if(column1Val === 'In Progress' && $("input[Title='column2']").val().length < 0) {
alert ('Column2 is a required field'); 
return false;
}
return true; 
}

</script>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.