Post by Sidecutter » Wed Aug 29, 2012 9:56 am

OPencart 1.4.9.6 - however, I suspect this question would apply the same to the 1.5.x versions.

When on the Products page in the Admin area, you can type a value in any field, and press enter to trigger the Filter function. However, this functionality does not carry across to many of the other pages where it would be highly desireable, such as when you are wanting to filter your orders on the Orders page. How can this be corrected - my assumption is that there's a way to instruct the page to treat pressing Enter the same as clicking on the Filter button, but I'm not sure how to fix it on the pages where it doesn't work.

Active Member

Posts

Joined
Tue Jan 18, 2011 6:58 am

Post by Avvici » Wed Aug 29, 2012 10:25 am

It is done via javascript:

In your common.js file here is an example of the search bar using it on the customer side:

Code: Select all

$('#header input[name=\'filter_name\']').bind('keydown', function(e) {
		if (e.keyCode == 13) {
			url = $('base').attr('href') + 'index.php?route=product/search';
			 
			var filter_name = $('input[name=\'filter_name\']').attr('value');
			
			if (filter_name) {
				url += '&filter_name=' + encodeURIComponent(filter_name);
			}
			
			location = url;
		}
	});

User avatar
Expert Member

Posts

Joined
Tue Apr 05, 2011 12:09 pm
Location - Asheville, NC

Post by outoftheordinary » Wed Nov 21, 2012 2:14 pm

Thank you avvici. Solved my problem in search bar.

- OpenCart 1.5.3.1
- Default theme

outoftheordinary


New member

Posts

Joined
Sun Nov 18, 2012 11:28 am

Post by Sidecutter » Sun Jan 06, 2013 7:22 pm

avvici wrote:It is done via javascript:

In your common.js file here is an example of the search bar using it on the customer side: (snipped)
Finally getting a chance to come back to this...I don't see a common.js file on the catalog side, or the admin side. But to be frank, I wouldn't know what to do with it if I did. I would have though this would be coded into the template for each page?

Active Member

Posts

Joined
Tue Jan 18, 2011 6:58 am

Post by ChetanCx » Sun Jan 06, 2013 8:59 pm

Sidecutter wrote:I don't see a common.js file on the catalog side, or the admin side. ... I would have though this would be coded into the template for each page?
there was no common.js file in v1.4x, avvici used example of 1.5.x opencart.
it don't have to be coded in all template page, just use the id's or classes from templates and write the corresponding java-script code in common.js. just a create common.js file in catalog/admin/view/javascript folder and add its link in catalog/admin/view/common/header.tpl like

Code: Select all

<script type="text/javascript" src="catalog/view/javascript/common.js"></script>

User avatar
Active Member

Posts

Joined
Sat Dec 08, 2012 8:12 pm

Post by Sidecutter » Mon Jan 07, 2013 8:54 am

Yeah, that's a bit above what I'm comfortable with, and I know literally zero about what a JS file would need to contain. I'd be much more comfortable adding to or altering the specific button code on the necessary pages, if it's possible to do so.

Active Member

Posts

Joined
Tue Jan 18, 2011 6:58 am

Post by Sidecutter » Wed Jan 09, 2013 1:19 pm

OK, failing that...you hit enter on the Products page and it searches...where's the piece of code that makes it work on that page, but is missing from the others? If I know where that is I figure I have good odds of being able to replicate or modify it.

Active Member

Posts

Joined
Tue Jan 18, 2011 6:58 am

Post by ChetanCx » Thu Jan 10, 2013 3:35 am

Sidecutter wrote:where's the piece of code that makes it work on that page, but is missing from the others? .
its located at the bottom of product_list.tpl

Code: Select all

<script type="text/javascript"><!--
$('#form input').keydown(function(e) {
	if (e.keyCode == 13) {
		filter();
	}
});
//--></script>
here 13 is the ASCII code of enter or return

User avatar
Active Member

Posts

Joined
Sat Dec 08, 2012 8:12 pm

Post by Sidecutter » Thu Jan 10, 2013 7:26 am

ChetanCx wrote:
Sidecutter wrote:where's the piece of code that makes it work on that page, but is missing from the others? .
its located at the bottom of product_list.tpl

Code: Select all

<script type="text/javascript"><!--
$('#form input').keydown(function(e) {
	if (e.keyCode == 13) {
		filter();
	}
});
//--></script>
here 13 is the ASCII code of enter or return
*EDIT* added the code to customer_list and sales_list, and it works with anything that isn't a flyout or dropdown selection, so anything you would normally enter text on, which is exactly what I needed. Finding orders to update them was a huge pain because of having to shift so often between keyboard and mouse.

Active Member

Posts

Joined
Tue Jan 18, 2011 6:58 am

User avatar
New member

Posts

Joined
Tue Jul 05, 2011 3:53 pm


Post by maccadon » Tue Nov 10, 2015 10:35 pm

I cannot get this to work on Opencart 2.0.3.1. Does anybody have a solution for this?

Active Member

Posts

Joined
Thu Aug 05, 2010 9:57 pm

Post by Nonsense » Thu Sep 08, 2016 3:53 pm

For opencart 2.0.3.1 you can paste this code:

Code: Select all

 $(document).keypress(function(e) {
    if(e.which == 13) {
       $("#button-filter").click();
    }
});
just above

Code: Select all

$('#button-filter').on('click', function() {
in admin/view/template/catalog/product_list.tpl

Newbie

Posts

Joined
Thu Sep 08, 2016 3:50 pm

Post by mupcku » Thu Aug 24, 2017 7:12 pm

Nonsense wrote:
Thu Sep 08, 2016 3:53 pm
For opencart 2.0.3.1 you can paste this code:

Code: Select all

 $(document).keypress(function(e) {
    if(e.which == 13) {
       $("#button-filter").click();
    }
});
just above

Code: Select all

$('#button-filter').on('click', function() {
in admin/view/template/catalog/product_list.tpl
On version 2.1.0.1 is not working!

https://wedeom.bg
Image


Active Member

Posts

Joined
Tue Jan 24, 2017 8:12 pm

Post by bifflowman » Fri Jun 15, 2018 11:32 pm

Nonsense wrote:
Thu Sep 08, 2016 3:53 pm
For opencart 2.0.3.1 you can paste this code:

Code: Select all

 $(document).keypress(function(e) {
    if(e.which == 13) {
       $("#button-filter").click();
    }
});
just above

Code: Select all

$('#button-filter').on('click', function() {
in admin/view/template/catalog/product_list.tpl
This worked for me on OC 2.3.0.2

New member

Posts

Joined
Fri May 04, 2012 12:12 pm
Location - Barrington IL

Post by Johnathan » Sat Jun 16, 2018 2:01 am

Just wanted to note, my OpenCart Admin Improvements extension adds this functionality, as well as a bunch of other admin panel improvements. If you can't get the code snippets in this topic working for your particular OpenCart version, it might be an easier option.

Image Image Image Image Image


User avatar
Administrator

Posts

Joined
Fri Dec 18, 2009 3:08 am


Post by wowliving » Wed Jan 08, 2020 5:39 am

hi is there a code and instructions for version 3.0.2.0? thanks!
staysey

Newbie

Posts

Joined
Mon Mar 27, 2017 9:34 am

Post by oxyuranus@abv.bg » Fri Apr 12, 2024 8:01 pm

wowliving wrote:
Wed Jan 08, 2020 5:39 am
hi is there a code and instructions for version 3.0.2.0? thanks!
staysey
I just wrote it for 3.0.2.0 :)
Add in file admin/view/template/catalog/product_list.twig at the end, below last

Code: Select all

//--></script>
and just above

Code: Select all

</div>
{{ footer }}
this code:

Code: Select all

<script type="text/javascript"><!--
  const buttonFilter = document.getElementById('button-filter');

  document.getElementById('input-name').addEventListener('keypress', function (e) {
    if (e.keyCode === 13)
      buttonFilter.click();
  });
  document.getElementById('input-model').addEventListener('keypress', function (e) {
    if (e.keyCode === 13)
      buttonFilter.click();
  });
  document.getElementById('input-price').addEventListener('keypress', function (e) {
    if (e.keyCode === 13)
      buttonFilter.click();
  });
  document.getElementById('input-quantity').addEventListener('keypress', function (e) {
    if (e.keyCode === 13)
      buttonFilter.click();
  });
  document.getElementById('input-status').addEventListener('keypress', function (e) {
    if (e.keyCode === 13)
      buttonFilter.click();
  });
//--></script>
Don't forget to refresh extensions cache after editing TWIG file (Extensions > Modifications > click button "Refresh" in the top right corner).


Posts

Joined
Thu Jan 13, 2022 11:22 pm
Who is online

Users browsing this forum: No registered users and 312 guests