Jump to content

How to run submit on search form after dropdown update


Recommended Posts

Hello All,

I thought I'd post this solution as I couldn't find it in the forums and it seems like it would be usable in a lot of situations. This method will run 'submit' in a search form when a dropdown in that form is updated. This way the user doesn't have to add an additional button click to view the results. It makes for a smoother U.X. 

First, and do this in the form's header, hide the Search form's submit button: 

<style>

input.cbSearchButton {
display: none!important;
}

</style>

Then  create a custom button to run 'Submit' but hide it. Also, give it an Id="myBtn" so the js can find it to run its onclick. 

<input id="myBtn" class="cb_submit" type="submit" value="View" style="display:none;" />

Now put some code to run when the dropdown is updated. In this case the dropdown is the first field in the Search form: 

<script type="text/javascript">

document.addEventListener('DataPageReady', function (event) {
 
var zr = document.querySelector('[name*=Value1_1]');
 
zr.onchange = function() {

document.getElementById("myBtn").click();

}

});

</script>

Hope this helps anyone looking for a similar solution-- 

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

×
×
  • Create New...