Let us explore more in to area of jQuery with respect to SharePoint. When we want some field to not appear in the NewForm or EditForm or so we can make a use of jQuery to hide them.
When we want to toggle the visibility of any field on the form, we can achieve the same with the jQuery.
jQuery has helped a lot in the world of SharePoint.
I’ve created one test list and I have one column named status. There are four entries in that as you can see in below figure.
Now I want to toggle the Reason text area below that. So I’ve written the following code in jQuery. Just add content editor web part and write down the following code. You have to modify your HTML portion based on your field name. Just observe the view source and check the hierarchy level for span, td and tr for the field and accordingly make the change.
Note: One big change. make sure that you write == sign to compare instead of = sign. make this change while writing the code for above figure.
We are handling the change event of dropdown here; you can do the same stuff with checkbox, just make sure to change the change event function to click function. That is the only change required if you would like to go with checkbox.
When I select the drop down and change the value, I get to see text area also toggles.
And when I change the drop down value
You can also use hide () and show () function to get the desired field on the page and use these methods to perform your own functions as per the need.
4 comments:
Great Option wish your instructions where a little biut more complete, like do you add your script to form page or the listview page using designer also what do you mean by replacing compare = with ==
its not on list view its on newform/editform and also its without using designer
Checkout this link
http://www.sharepointkings.com/2008/05/how-to-edit-list-forms-like-newformaspx.html
other answer to question is
compare using == in javascript:
the screen shot showing javascript is using = to compare (selecteditem="suspended") which is wrong so keep the note just below image and hoping reader can understand.
Hello SharePoint Kings, I tried to implement the code but the feature is not working for me... this is the code I'm using: is there any sintax error?
$("select[title$='Status']").change(function()
{
var selecteditem = $("ctl00$m$g_e2e95f61_cbcb_43da_af5c_c38a5544eff3$ctl00$ctl04$ctl01$ctl00$ctl00$ctl04$ctl00$DropDownChoice :selected").text();
if(selecteditem = "Suspended")
{
$("textarea[title$='Reason'].parent('span').parent('td').parent('tr').parent('table').toggle();
is it showing you any JavaScript error or script is not working?
Post a Comment