Response title
This is preview!
Move this topic
Sharepoint Jquery Conditional dropdown validation
in Using jQuery
•
7 years ago
I have a dropdown named "Status" with a "Yes" and "No With Reservation" as options. If the user choose 'Yes", form can be submitted, if "No With Reservation", user must fill out an "Explanation" multiline textbox below the dropdown.
I have access to Sharepoint Designer so any help to achieve this is highly appreciated.
1
Replies(21)
Are you using a validation plugin? If so, which one?
Are you interested in HTML5 validation or are you already using a script?
Does it being sharepoint make some difference?
It’s always best to share a link or at least the code you have tried.
JΛ̊KE
Leave a comment on jakecigar's reply
I am using the OTB built in validation and entering the following formula to validation within the Sharepoint List Settings
This one doesn't work because it doesn't recognize "No with Reservation" which is a must but if I change it to just "No" and use a single Explanation textbox instead of multiline, it works.
=IF([Status]=”No with Reservation”,IF([Explanation]<>””,TRUE,FALSE),TRUE)
I want to use a script since it is simpler to implement on a sharepoint form. The link cannot be shared since it is an intranet app.
Thanks.
Leave a comment on N Mendoza's reply
You need help from a Sharepoint forum. Your code is not jQuery.
JΛ̊KE
Leave a comment on jakecigar's reply
I know it is not. I am looking for a jquery solution which is possible to use in Sharepoint environment.
This is a jquery I used before to move a description above a textbox
<script type="text/javascript" src="Style%20Library/JS/jquery-1.11.3.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('td.ms-formbody').each(function(){
var theDescrip = $(this).contents('span.ms-metadata');
// var newValue = $(this).val(theDescrip) + '<br/>';
$(this).prepend(theDescrip);
theDescrip.after("<br/>");
});
});
</script>
I can’t guess your HTML. Make a fiddle!
JΛ̊KE
Leave a comment on N Mendoza's reply
Nobody here uses sharepoint. And server side validation requires server code.
You have nothing to share, so we could only play guessing games. If you shared the generated HTML in a http://jsfiddle.net demo, maybe we could help out.
JΛ̊KE
Leave a comment on jakecigar's reply
Leave a comment on N Mendoza's reply
And many of them were answered by me. I can’t help you with your server side code.
JΛ̊KE
Leave a comment on jakecigar's reply
This is not a server side code. It is a client script embedded on the page that fires when the submit button is pressed...
This is working but the bolded area is not so something is not right with my structure....
<script src="/JS/jquery.min.js"></script>
<script>
function PreSaveAction()
{
return formVal(); //calls the validation on save
}
function formVal() {
if ($("[title='Acknowledgement']").val() == 'Yes') {
return true;
}
else {
if ($("[title='Acknowledgement Exception']").val().length) //checks if not empty use length > X to stipulate min char length allowed
{
return true;
}
else { //textbox is empty
alert('Error: Please add the required exception into the box before submitting');
}
}
return false;
if ($("[title='Preparation/Review']").val() == 'Yes') {
return true;
}
else {
if ($("[title='Preparation Exception']").val().length) //checks if not empty use length > X to stipulate min char length allowed
{
return true;
}
else { //textbox is empty
alert('Error: Please add the required exception into the box before submitting');
}
}
return false;
}
</script>
Leave a comment on N Mendoza's reply
And there is no HTML there. I need to see it in action in the browser. Make a jsfiddle.net demo.
JΛ̊KE
Leave a comment on jakecigar's reply
Finally, I learned how to use fiddle. So here is the HTML. If user choose "No With Exception", user must fill out corresponding textarea otherwise, form cannot be submitted and an error message will appear.
Frustratingly, I cannot use the Sharepoint built-in validations and formulas because the maximum IF statements is 7 only!
Thanks in advance for your help Jake.
Leave a comment on N Mendoza's reply
https://jsfiddle.net/jakecigar/affbr6kt/4/ <-- should alert("wrong") and not allow submit if the form is not filled out correctly.
JΛ̊KE
Leave a comment on jakecigar's reply
Cannot make this work in Sharepoint...;-(
Leave a comment on N Mendoza's reply
But the fiddle works. https://jsfiddle.net/jakecigar/affbr6kt/5/ is the same code put in a "ready" callback.
JΛ̊KE
Leave a comment on jakecigar's reply
This is your fiddle code so how can I apply
************
$(function() {
$("form").submit(function(e) {
$("select", this).each(function() {
var sel = $(this).val()
var ta = $(this).next().val().trim()
if (sel !== "Yes" && ta === "") {
alert("wrong!")
e.preventDefault()
}
})
})
})
***********
in this format?
<script>
function PreSaveAction()
{
return formVal(); //calls the validation on save
}
function formVal()
</script>
Leave a comment on N Mendoza's reply
- <script>
- $(function() {
- $("form").submit(function(e) { // all forms, use a selector if it is just one.
- $("select", this).each(function() {
- var sel = $(this).val()
- var ta = $(this).next().val().trim()
- if (sel !== "Yes" && ta === "") {
- alert("wrong!")
- e.preventDefault()
- }
- })
- })
- })
- </script>
JΛ̊KE
Leave a comment on jakecigar's reply
I embedded your raw script using script editor and tested it, it did not validate.
Leave a comment on N Mendoza's reply
Leave a comment on jakecigar's reply
Leave a comment on jakecigar's reply
<script>
$(function() {
$("form").submit(function(e) { // all forms, use a selector if it is just one.
$("select", this).each(function() {
var sel = $(this).val();
var ta = $(this).next().val().trim();
if (sel !== "Yes" && ta === "") {
alert("wrong!");
e.preventDefault();
}
});
});
})
</script>
Did not work..
Leave a comment on N Mendoza's reply
That’s too bad. "Did not work" gives me nothing to go on.
You won’t make a demo page for us to visit, you haven’t said what errors if any you get.
You won’t make a demo page for us to visit, you haven’t said what errors if any you get.
Good luck!
JΛ̊KE
Leave a comment on jakecigar's reply
Change topic type
Link this topic
Provide the permalink of a topic that is related to this topic
Reply to N Mendoza's question
{"z437929396":[14737000006853066,14737000006854027,14737000006854029,14737000006854061,14737000006854071,14737000006864221,14737000006862547,14737000006862549,14737000006862551,14737000006862649],"z2950240":[14737000006855027,14737000006855031,14737000006855039,14737000006855033,14737000006855161,14737000006855167,14737000006862225,14737000006864485,14737000006864487,14737000006864489,14737000006864491,14737000006864597]}