I have a SharePoint list Emp Details with 2 fields EmpNo, EmpName. In another SharePoint list Claims in the same site, whenever a user enters EmpNo in the New, or Edit list forms, it should automatically fetch EmpName from the Emp Details list and display it in a field called DisplayName.

If I create the EmpNo as a lookup field with Emp Details list as the source, it gives me a drop down with all EmpNo which is not what I want. I should let the user manually enter the EmpNo in a textbox.

Can this be achieved without any coding? My last choice would be to implement this using a workflow but that's not real time as user wont be able to see the name in the form.


After following Shihan's idea, I inserted a Content Editor web part and wrote the following javascript:

window.onload =function (){
document.getElementById('WPQ2d8513746-27be-41e3-a06c-f5d7b577970fTitle').addEventListener("change", myFunction);
function myFunction() 
    var empno = document.getElementById('WPQ2d8513746-27be-41e3-a06c-f5d7b577970fTitle');
    if(empno.length == 9)
        var textToFind = empno;

        var dd = document.getElementById('WPQ2d8513746-27be-41e3-a06c-f5d7b577970fEmpID_Auto');
        var txtNew = document.getElementById('WPQ2d8513746-27be-41e3-a06c-f5d7b577970fEmp_x0020_Name');
        for (var i = 0; i < dd.options.length; i++) 
            var empCombined = dd.options[i].text;
            var empid = empCombined.substring(0, 9);
            if (empid == textToFind) 
                    dd.selectedIndex = i;
                    txtNew.value =  empCombined.substring(empCombined.indexOf("-")+1, empCombined.Length);
} </script>

Now its throwing me an error Uncaught TypeError: Cannot read property 'addEventListener' of null at window.onload. It looks like the ID value I've provided is not correct but that is what I found when I looked at the frame source of New List form. Sample below for the Emp No textbox.

    <td nowrap="true" valign="top" width="113px" class="ms-formlabel"><h3 class="ms-standardheader">
    <nobr>Employee Number<span class="ms-accentText" title="This is a required field." > *</span></nobr>
    <td valign="top" width="350px" class="ms-formbody">
    <!-- FieldName="Employee Number"
        <span id='WPQ2d8513746-27be-41e3-a06c-f5d7b577970fTitle' data-sp-control='SPFieldText' data-sp-options='{&quot;mode&quot;:3,&quot;source&quot;:&quot;Title&quot;}'></span>

I also tried providing directly the field name and the field internal name to get the value of Emp No text box but its not working. Where am I wrong?

1 Answer 1


I don't think this is possible with no coding at all. But what if you keep your lookup to "Emp Details", add another single line text field "Emp Number" to the list "Claims". Then add a script editor WebPart to the NewForm/EditForm and add JavaScript code that selects the option in the lookup drop down based on the text the user enteres in the "Emp Number" text field (if it matches). The drop down row is made hidden (or better, disabled) with JavaScript (jQuery) with the code in the script editor WebPart. You have to make sure that the drop down has a value before submitting it (required field or list validation).

  • Thanks for the idea, Shihan! I'll try this now and will accept it as the answer if it works.
    – user841311
    Commented Apr 4, 2017 at 8:41
  • Even before writing the javascript code, this is not going to work because of a different issue i.e. the additional field I got (Emp Name) based on the lookup field (Emp No) is not showing up in New/Edit forms. The additional field is not showing up in the list columns for me to add it to the content type.
    – user841311
    Commented Apr 4, 2017 at 13:33
  • Well, you could add a calculated column "EmpCombined" (of type single line of text) to "Emp Details", with a formular to concatenate the EmpNo and the EmpName and add a separator, eg (Title = EmpNo): =CONCATENATE(Titel;" - ";EmpName). Then you can display this "EmpCombined" column in the lookup column of the Claims list (instead of "EmpNo" or "EmpBoth". This lookup colum will be in NewForm and EditForm. When the users enters a text in an additional text field you can select matching options with JavaScript, and copy the part after the separator (" - " in the example) to another field.
    – Shihan
    Commented Apr 4, 2017 at 14:39
  • please check the updated question with code that implements your idea but it's failing to retrieve textbox value using javascript.
    – user841311
    Commented Apr 4, 2017 at 17:56
  • The source you provided in the updated answer, doesn't show any input fields and you say "list form". Did you use the source from the list overview instead of a NewForm or EditForm? It should look something like '<input title="Titel" class="ms-long ms-spellcheck-true" id="Title_fa564e0f-0c70-4ab9-b863-0177e6ddd247_$TextField" type="text" maxlength="255" value="">' - I suggest you get jQuery, upload it to a SharePoint library ("Styles Library" for example), use 'Script Editor' instead of a 'Content Editor' add a reference to jQuery in this 'Script Editor'-WP and change the code to use jQuery.
    – Shihan
    Commented Apr 6, 2017 at 8:02

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.