0

I have the following code in a content editor web part and it doesn't seem to work on my SharePoint new form page.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><script>$(document).ready(function(){
$("select[title='ProjectCode']").change(function(){
    alert("The text has been changed.");
});});</script>

but this code does work.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><script>$(document).ready(function(){
$("input").change(function(){
    alert("The text has been changed.");
});});</script>

I'd like to only change items of a specific ID or title. I've verified the title information is correct as well by inspecting the element in the developers tools in IE.

Can anyone see what I am doing wrong in my code?

  • 2
    Your selector is probably wrong. Execute this in your console: $("select[title='ProjectCode']").length. Does it return zero? Then your selector is wrong. – Derek Gusoff Aug 30 '18 at 20:58
  • I tried adding something in the field and then ran the code you suggested. It returned 1. This is what's returned when I look in the DOM Explorer. <input title="ProjectCode" class="ms-long ms-spellcheck-true" id="ProjectCode_184abcce-b67c-4baf-b355-7746047597de_$TextField" type="text" maxlength="255" value=""> – Will73 Aug 31 '18 at 12:02
2

Rather than trying $("Select[Title='...']") Can you try $("[Title='ProjectCode']")? I believe that Select isn't a valid CSS selector, which is more or less what jQuery runs off of. With just the $("[title='ProjectCode']"), the CSS selector should pick all objects that have the title as 'ProjectCode'.

This will make your code segment as follows:

$(document).ready(function(){
    $("[title='ProjectCode']").change(function(){
        alert("The text has been changed.");
    });
});
  • 1
    Thanks KGlasier! That was it. I thought that Select statement was correct, but it worked as soon as I removed it. Thanks again! – Will73 Aug 31 '18 at 12:14
1

The title of your select element may be invalid!

Pike up the correct title using F12 developer tools and run your code again.

Another guess, drop your code in script editor web part instead of content editor

1

Check the type of the "ProjectCode" field.

If the field is a Choices(dropdown list) or lookup field, we can use the code below.

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
    $("select[title='ProjectCode']").change(function(){
        alert("The text has been changed.");
    });
});
</script>

If the field is a single line of text, we need use the code below.

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
    $("input[title='ProjectCode']").change(function(){
        alert("The text has been changed.");
    });
});
</script>
0

Seems like syntax error in your code. You have used }); twice.

Use below code. It will work :

$("select[title='ProjectCode']").change(function(){
    alert("The text has been changed.");
});
  • Hi Rohit. I tried removing the characters, but that didn't seem to help. I think I need the second set though since I have two functions in the code block. – Will73 Aug 30 '18 at 19:56

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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