cancel
Showing results for 
Search instead for 
Did you mean: 
Highlighted
jflegras
Nintex Newbie

Search help on very long lookup

On a recent project, a lookup field contained hundreds of results, even applying cascading, and the customer wanted to be able to search on multiple criteria, like the search zone in views. So, how to add a search help on a field.

1. The search interface

The search interface is a simple list view to inherit from the search zone, column filters, sort, ...

Create a view called "Search" on lookup list. It's a webpart page. Edit the webpart to hide toolbar. Keep only the search zone.

Under the list webpart, add a content editor webpart with that source :

<style type="text/css">

    .ms-dialog #s4-ribbonrow, .ms-dialog .ms-cui-topBar2, .ms-dialog .s4-notdlg, .ms-dialog .s4-pr s4-ribbonrowhidetitle, .ms-dialog .s4-notdlg noindex, .ms-dialog #ms-cui-ribbonTopBars, .ms-dialog #s4-titlerow, .ms-dialog #s4-pr s4-notdlg s4-titlerowhidetitle, .ms-dialog #s4-leftpanel-content {display:none !important;}

    .ms-dialog .s4-ca{margin-left:0px !important; margin-right:0px !important;}

</style>

<script type="text/javascript">

function ModalOk_click() {

  var ctx = SP.ClientContext.get_current();

  var items = SP.ListOperation.Selection.getSelectedItems(ctx);

  if (items.length == 1) {

  SP.UI.ModalDialog.commonModalDialogClose(SP.UI.DialogResult.OK, items[0].id);

  } else {

  alert('Veuillez s\351lectionner un \351l\351ment');

  }

}

function ModalCancel_click() {

  SP.UI.ModalDialog.commonModalDialogClose(SP.UI.DialogResult.cancel, 'Cancel clicked');

}

</script>

<input type="button" name="BtnOK" id="btnModalOK" value="OK" onclick="ModalOk_click();" />

<input type="button" name="BtnCancel" id="btnModalCancel" value="Cancel" onclick="ModalCancel_click()">

  • Some css to hide ribbon
  • function ModalOK_click
    • get selected items in the list
    • alerts if not only one item selected
    • close the window, returning item's id
  • function modalCancel_click
    • close the window
  • Add two buttons : OK and Cancel

2. The main form

Add a Search button near the lookup control.

Button call javascript function OpenDialog()

Add javascript to form parameters :

//User Defined Function to Open Dialog Framework

function OpenDialog() {

var dialogOptions = SP.UI.$create_DialogOptions();

dialogOptions.url = ".../Lists/Bureaux/search.aspx";

dialogOptions.width = 750; // Width of the Dialog

dialogOptions.height = 500; // Height of the Dialog

dialogOptions.dialogReturnValueCallback = Function.createDelegate( null, CloseCallback); // Function to capture dialog closed event

SP.UI.ModalDialog.showModalDialog(dialogOptions); // Open the Dialog

return false;

}// Dialog close event capture function

function CloseCallback(strReturnValue, target)

{

  if (strReturnValue === SP.UI.DialogResult.OK) // Perform action on Ok.

     {

NWF$("#"+Bureau).val(target);

NWF$("input#"+Bureau).val(target);

}

}

  • Open the search view of LookupList
    • Define url, window size with dialogOptions structure
  • CloseCallback is started when popup is closed, with two parameters
    • strReturnValue : OK or Cancel
    • target : the id of the selected item pass back with commonModalDialogClose
  • Update the lookup field (Searching the longest to find the good syntax)
    • Add Client ID to lookup field (Bureau)
    • Two updates are necessary (don't ask me why, I couldn't explain. I'm a beginner in Javascript)
      • NWF$("#"+Bureau").val and NWF$("input#"+Bureau").val
Reply
3 Replies
cherylshah
Nintex Newbie

Re: Search help on very long lookup

Hello @jflegras ,

Thank you for posting this. It is exactly the thing I need to do. I am having trouble getting it to work though. After clicking the search button on my main form, it "thinks" for a few seconds then returns to the main form without having opened the search view of my lookup list. Have any changes in JavaScript since July 2016 caused the need to update this code?

 

Or, in these lines:

 

NWF$("#"+Bureau).val(target);

NWF$("input#"+Bureau).val(target);

 

What do I substitue for "Bureau"? The name of the lookup column? Does something specific have to be substituted for "target"?

0 Kudos
Reply
jf_legras
Nintex Newbie

Re: Search help on very long lookup

 

Hello @cherylshah ,

 

happy to help you.

 

Probably an error with "dialogOptions.url". This is the url of the view you have created for the search.

Be sure the function called by the javascript search button is the same name than your function.

Bureau is "Client ID javascript variable name" set in advanced tab of the lookup column.

To update "lookup column", it depends of the Nintex Forms version. If previous solution doesn't work, please try something like :

 

var idBureauSELECT = idBureau.replace("_hid","");
NWF$("#" + idBureauSELECT).val(target);
NWF$("input#" + idBureau).val(target);

 

"target" is the value return by the CloseCallBack function.

 

Regards

0 Kudos
Reply
cherylshah
Nintex Newbie

Re: Search help on very long lookup

Thank you very much for your reply @jf_legras . Following your directions:

 

The script I now have in the Form Settings is:

Form JavaScript.png

 

(continued...)

Form JavaScript Part 2.png

 

I've tried both the full and relative URLs to the search view.

 

The button settings are:Button Settings.png

Client click matches the function name.

 

The lookup control settings (this lookup is multiple choice, is that a problem?) are:

Lookup Control Settings.png

 

So the Client ID JavaScript variable name matches these lines in the Custom JavaScript setting on the form:

 

 var idEquipmentSELECT = idEquipment.replace("_hid","");
 NWF$("#"+Equipment).val(target);
 NWF$("input#"+Equipment).val(target);

Do you see anything that is wrong? It is still behaving the same way - I click the search button on the form and the dialog does not open. Thank you for any further help you can provide!

0 Kudos
Reply