# Make SharePoint Form field Required based on another field using JQuery

I have SharePoint 2013 foundation and would like to use JQuery on a custom NewForm to make Col1 and Col2 required when 'Option 1' is selected from Col3.

Could I also get the JQuery I would use on the custom EditForm where Col6 already says 'Option 1' thus making Col4 and Col5 required? I would need this in a case where the Client entering in NewForm would not need it to be required, but the Client editing the form would.

If I try to use List Validation, it removes the JQuery I am already using on the custom NewForm when validating the List Validation.

• bind your validation logic into PreSaveAction that the submit button provides or override the OnPostRender fucntion using JSLink. – Aveenav Oct 12 '16 at 22:06
• Could you write how I would do that? I was given the jquery code because I am not too familiar with the language. – Caleb Fortner Oct 12 '16 at 22:10
• Take a look at Related questions to the right. There are plenty of samples here on Stack Exchange. – Aveenav Oct 13 '16 at 15:36
• The reason I am asking the question is not because I haven't research this, because I have for about a week now. It's because I have tried the other solutions and haven't been able to get them to work. Either their questions aren't exactly what I'm looking for or the answers pass them off to somewhere else. I am just now getting into Jquery so i was hoping the community could help write me something to start this off for me. The question above asks for 2 conditions but in my list I'll be using close to 50. So I just need help getting the ball rolling – Caleb Fortner Oct 13 '16 at 15:40
• Can you post code that you've tried so far, also what's the column type for Col1,Col2.....Col5 ? – Aveenav Oct 14 '16 at 15:35

This should get you started. Dependency: jQuery

function PreSaveAction() {
var proceed = true;

var ddSelectedCol3 = $('select[title^="Col3"]:eq(0) option:selected').text(); if (ddSelectedCol3 == 'Option 1') { var appendAlertMsg = false; //Col1 and Col2 are required.$("input[title^='Col1']", "input[title^='Col2']").each(function () {
if (!$.trim($(this).val())) { //if this field is empty
$(this).css('border-color', 'red'); //change border color to red proceed = false; //set do not proceed flag appendAlertMsg = true; } }); if (appendAlertMsg) alertMsg += "\n- Col1 & Col2 are required."; } var ddSelectedCol6 =$('select[title^="Col6"]:eq(0) option:selected').text();
if (ddSelectedCol6 == 'Option 1') {
//Col4 and Col5 are required. Assuming these are text fields
$("input[title^='Col4']", "input[title^='Col5']").each(function () { if (!$.trim($(this).val())) { //if this field is empty$(this).css('border-color', 'red'); //change border color to red
proceed = false; //set do not proceed flag