Forum Discussion

ChrisNewsome's avatar
ChrisNewsome
Qrew Captain
6 years ago

Add a search box to a table's top bar

So we are constantly going back and forth to the table icons to search... we use QBase as a CRM, so for example, we are looking at a customer's record, and if we need to look up another customer, we hit the "Customers" button at the top table bar, then search. I'd like to have that search function on the top, on the line where we have the "new customer" green button, etc. This would save us a lot of clicking around. Any idea if this is possible? I couldn't find any way to edit that bar.

18 Replies

  • So out of the box it would likely be a good feature enhancement, but currently there is nothing in the settings that has that as a feature. That said - if you're familiar with the Image Onload Technique and feel comfortable with scripting techniques, you could run a script with IOL that dynamically adds HTML to the page when it loads, and then add your own Javascript into the element to achieve the functionality you want. Credit to the link below for the building block behind it.
    https://haversineconsulting.quickbase.com/db/bgcwm2m4g?a=dr&rid=582&_ga=2.54479343.670650234...

    With that - you can run a code page that does something like:

    var input_html = "<input id='customer' type='text' placeholder='Search Customer #' style='border-radius:2px;height:25px;font-size: 12pt'>";
    input_html += "<span style='cursor:pointer;margin-right: 25px' onclick='searchCustomers()' class='BrandBarIconDark Find DisplayInlineBlock WithText'></span>"
    $("#pageNavBarActions").prepend(input_html)
    Looks something like this when complete


    This will add a search box next to the save button - all you would have to do is configure the searchCustomer() function in your code page and you'd be all set.

    Chayce Duncan | Technical Lead
    (720) 739-1406 | chayceduncan@quandarycg.com
    Quandary Knowledge Base
    • ChrisNewsome's avatar
      ChrisNewsome
      Qrew Captain
      this is exactly what I wanted, but I have no idea about IOL. If you can give me an of how to pull that off, I'll look into it.
    • ChayceDuncan2's avatar
      ChayceDuncan2
      Qrew Cadet
      So this link here: https://haversineconsulting.quickbase.com/db/bgcwm2m4g?a=dr&rid=582&_ga=2.147307188.2014909509.1553519734-272478357.1552062926
      Shows you the code of embedding IOL in the branding element. To do it - open the Settings > Branding Page in your app, open your dev console in your browser - and then copy and paste the code to turn IOL on from that link, then hit enter. 

      When its enabled - it basically means that any time your application loads it will try and run your script since the branding element is always present. 

      The example code references a page called moduleBOL.js - so the last step is to also create a Quick Base code page (similar to a home page - but code based). Thats where you'll actually embed all your code to build your search button. You can try and do the standard console.log("hello world"); in the code page and watch the console to see if it came together.

      Hopefully that gets you started. Feel free to shoot me an email and I can give you more info / send more screenshots or code snippets

      Chayce Duncan | Technical Lead
      (720) 739-1406 | chayceduncan@quandarycg.com
      Quandary Knowledge Base
    • EOMDevelepors's avatar
      EOMDevelepors
      Qrew Captain
      I set this up. I like it. I need some help setting up the searchCustomer() function.

      Can you help please.

      Thanks
  • Another option is to put a search icon on the Dashboard
    The Dashbiard would load faster than a report if you limit the Dashboard to non report elements.
    • ChrisNewsome's avatar
      ChrisNewsome
      Qrew Captain
      When you say dashboard, are you talking about the home screen, or the header?
    • ChrisNewsome's avatar
      ChrisNewsome
      Qrew Captain
      So that still creates the extra click then. It feels no different than going back to the customers table.
  • There's also the global search on the top row of the screen (magnifying glass); which you can limit in the permissions to specific tables.
  • I think Dan's option is the simpler and cleaner option. I'm not comfortable enough with the coding side of things to go after Chayce's suggestion. I'll give this a shot and report back. Thanks!
  • Were you referring to me? I�m Mark. Just want to know if my suggestion is what you are going to try next.