Last active
August 29, 2019 13:05
-
-
Save B-uny/f42e722ed27a207ea82ee434053cecb9 to your computer and use it in GitHub Desktop.
Adding a search bar to order history in flits (workaround with JQuery). Haven't tried it in the normal cart but it wouldn't be too hard to implement. I found nothing on the flits site or shopify that said you can't add code to code that an app installs, but if anyone finds out that is the case please contact this account and I will remake this f…
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{% comment %} | |
//add the id to the achnor tag if you are keeping the origial my orders page and create a second anchor | |
//id="ordernavbtn" | |
//id="searchnavbtn" | |
//duplicate the my orders page and rename it to some name or just replace the entries (I wanted both) | |
{% endcomment %} | |
{% comment %} | |
//add the following below your 'flits-page-heading' div | |
{% endcomment %} | |
<input id="searchOrder" class="flits-search" placeholder="Type an Order Number here..."> | |
{% comment %} | |
//somwhere on the page add this: | |
{% endcomment %} | |
<script> | |
$(document).ready(function(){ | |
$("#searchOrder").keyup(function(){ | |
$(".flits-order-row").fadeOut(); | |
var valueInput = $("#searchOrder").val(); | |
var valueSearch = "#\\#"+valueInput ; //required due to how shopify grabs the ordername | |
$(valueSearch).fadeIn(); | |
}); | |
}) | |
//extra: fades back in the orignal search tab if you keep it | |
$("#ordernavbtn").click(function(){ | |
$(".flits-order-row").fadeIn(); | |
}); | |
//extra: rehides results of search tab when you click back from original order lookup | |
$("#searchnavbtn").click(function(){ | |
$(".flits-order-row").hide(); | |
var valueInput = $("#searchOrder").val(); | |
var valueSearch = "#\\#"+valueInput ; | |
$(valueSearch).fadeIn(); | |
}); | |
</script> | |
{% comment %} | |
//code will toggle this section | |
{% endcomment %} | |
<div id="{{ order.name }}" class="flits-order-row" style="display:none"></div> | |
{% comment %} | |
//add display none to first div and order.name as id | |
{% endcomment %} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment