Page 1 of 1

Modify search behavior in tableview (?)

Posted: 2020-06-01 13:59
by D Oliveira
Hello folks, I got a problem, hopefully someone can help.

Imagine a record name is "Chicken Breast Fried"

if you search "chicken breast" or "breast fried" your search will return successfully, but if you try to search "chicken fried" it wont show, does anyone know how to modify this search behavior or at least point me to the file where I can check the query? Thank you!

*The long way would be to get an algorithm to make all possible name combinations with the original name and insert all possibilities in a field named "keywords" just so it matches any search but that seems like a waste, hopefully there is a better way.

Re: Modify search behavior in tableview (?)

Posted: 2020-06-01 15:25
by D Oliveira
not an appgini solution but here it goes guys:

reference: https://selectize.github.io/selectize.js/

1- hide your search input for $SearchString (appgini's default quick search)

2- add the code in the tablename_view.php above echo $x->HTML;

Code: Select all


<?php

<br><br><br><br>

<div style="margin: 0 auto;text-align: center;">

<img src="foods.png?id=9" style="width: 57px;height: auto;" ></img>

</div>

<br>
					

<div class="wrapper">

//db connection

$con = mysqli_connect($dbServer, $dbUsername, $dbPassword);
mysqli_select_db($con,$dbDatabase);

$con->set_charset("utf8");

		$result = $con->query("select * from foods order by name ASC ");

				    echo '<html>';
				    echo '<body>';
						
				    echo '<select id="ss1" onchange="searchterm();" style="display: block;margin: 0 auto;text-align: center;width:300px;height:auto;" class="select-css" >';
				  
				    echo '<option style="text-transform:uppercase;color:black;" value="">🔎 SEARCH</option>';
				   
				    echo '<option style="text-transform:uppercase;color:black;" value="x">🔎 SEE ALL</option>';

				    

				    while ($row = $result->fetch_assoc()) {

				                  unset($idx, $name);
				                  $idx = $row['ID'];
				                  $name = mb_strtoupper($row['name'], "UTF-8");
				                  echo '<option style="text-transform:uppercase;color:black;" value='.$idx.'>'.'🔍 '.$name.'</option>';

					}

				    echo '</select>';
				    
				    
				    echo '<br><br><p id="ult_" style="  border-top-left-radius: 5px; border-top-right-radius: 5px;border-bottom-left-radius: 5px;border-bottom-right-radius: 5px;color:white;font-family:Gotham2;font-size:18px;text-align:center;" ></p>';
				  
				  
				    echo '<p id="ult" style="  padding:3px;padding-bottom:4px;border-top-left-radius: 5px;border-top-right-radius: 5px;border-bottom-left-radius: 5px;border-bottom-right-radius: 5px;background-color:rgba(122,122,122,0.3);color:white;font-family:Gotham2;font-size:20px;text-align:center;width: fit-content;margin:0 auto;" ></p>';				
				    
				    echo '</body>';
				    echo '</html>';

				 ?> 
				 
					</div>
							
		<!--</div>-->
		</div>


<script src="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.12.6/js/standalone/selectize.min.js" integrity="sha256-+C0A5Ilqmu4QcSPxrlGpaZxJ04VjsRjKu+G82kl5UJk=" crossorigin="anonymous"></script>		

<script type="text/javascript">

jQuery(document).ready(function () {
     jQuery('.select-css').selectize({
          //sortField: 'text'
      });

  });

var selectedProduct = sessionStorage.getItem("foods");

if(selectedProduct != undefined || selectedProduct != null){


$j('#ult_').text('👇');
var ultt = '\xa0\xa0'+selectedProduct.substr(0,selectedProduct.length)+'\xa0\xa0';
$j('#ult').text(ultt.toUpperCase());

}



    function getUrlVars() {
    var vars = {};
    var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
        vars[key] = value;
    });
    return vars;
    }



	function searchterm(){

		var lennn = document.getElementById("ss1").options[document.getElementById("ss1").selectedIndex].text.length;

		term = document.getElementById("ss1").options[document.getElementById("ss1").selectedIndex].text.substr(3, lennn);

		term2 = document.getElementById("ss1").options[document.getElementById("ss1").selectedIndex].text;


		sessionStorage.setItem("foods", term.toUpperCase());

		var replaced = term.split(' ').join('+');

		console.log('auto'+term)

		if(term2 == '🔎 SEE ALL'){

			window.location.assign('/fitbook/foods_view.php?SortField=2&SortDirection=asc&FilterAnd%5B1%5D=and&FilterField%5B1%5D=2&FilterOperator%5B1%5D=equal-to&FilterValue%5B1%5D=');


		}else{

			window.location.assign('/fitbook/foods_view.php?SortField=2&SortDirection=asc&FilterAnd%5B1%5D=and&FilterField%5B1%5D=2&FilterOperator%5B1%5D=equal-to&FilterValue%5B1%5D='+term);

		
		}



	}




</script>			


image:
https://ibb.co/qRYbYdy

video:
https://streamable.com/boz3c0

Re: Modify search behavior in tableview (?)

Posted: 2020-06-01 16:10
by D Oliveira
even though I have solved the issue with tableview I cannot replicate this behavior in a select2 inside detail view, anyone know how to modify the search behavior in that scenario? Thank you

Re: Modify search behavior in tableview (?)

Posted: 2020-06-01 16:27
by D Oliveira
something like:

https://jsfiddle.net/adigas/2g1q5ypn/

Image

that doesnt work with appgini =(

Re: Modify search behavior in tableview (?)

Posted: 2020-06-01 20:30
by a.gneady
You might find MySQL's full text natural language search useful here: https://dev.mysql.com/doc/refman/8.0/en ... guage.html

We posted a tutorial on applying full text search in AppGini some while ago here: https://bigprof.com/blog/appgini/using- ... gini-apps/

Re: Modify search behavior in tableview (?)

Posted: 2020-06-01 20:31
by D Oliveira
I've managed to make the feature work for the tableview search, even though I need more specific directions to change the functionality of select2 inside detail view, theres is no select element to work on, its in a div

Re: Modify search behavior in tableview (?)

Posted: 2020-06-01 20:59
by D Oliveira
is there a way to build a query using php in the _dv.html templates files? because then I could use selectize for that as well

the select2 inside _DV template is a lookup field, and I'll try to re-engineer that with selectize

Re: Modify search behavior in tableview (?)

Posted: 2020-06-02 20:22
by a.gneady
is there a way to build a query using php in the _dv.html templates files?
No, this is an html file. PHP code placed in it won't be parsed. But you could use the tablename_dv() hook function instead.

Re: Modify search behavior in tableview (?)

Posted: 2020-06-03 16:20
by pfrumkin
Could you embed js in the html, make ajax call within that?

Re: Modify search behavior in tableview (?)

Posted: 2020-06-03 18:03
by D Oliveira
pfrumkin wrote:
2020-06-03 16:20
Could you embed js in the html, make ajax call within that?
yes that did it! Im not gonna extend here because there was a lot of code for it to work, but if someone wants the answer it is html+js with ajax, inside ajax file make the while echo each option and on success function of ajax append those to select. Thanks guys

Re: Modify search behavior in tableview (?)

Posted: 2020-06-10 15:14
by onoehring
Hi,

a late suggestion: Maybe intercept the search after it has been submitted. Split the search phrase (by spaces) and build a new search string from that (WHERE x='chicken' OR x='breast' ...). Pass that along to the page and use it as options->sqlwhere variable?

Olaf

Re: Modify search behavior in tableview (?)

Posted: 2020-06-10 15:40
by D Oliveira
thank you for taking the time, I personally think selectize looks better than the usual select2 box, I know a lot can be done with .css but still prefer selectize, also Im not sure about the search time using that method within a table with millions of records, take a look at the finished work at fitbookapp.net/fitbook user: teste password: teste and then click on "comunidade" thanks a lot =) cheers!