Toggle Side Panel
Close search

Activity › Forums › Salesforce® Discussions › How can we fetch data without using Controller functions on salesforce VisualForce page?

Tagged: , , ,

  • Salesforce® Discussions

    How can we fetch data without using Controller functions on salesforce VisualForce page?

    Posted by sushant on December 13, 2016 at 1:56 PM

    Hi All,

    I am in a scenario where i need to search data using keypress action from a list of accounts and i need to use javascript function in this not controller function.Is there any way to do this.i have written the following code:

    <apex:page controller="SearchAccountJS">
    <script>
    function search(){
    if( name != ''){
    var str=sforce.connection.query('SELECT id,Name,AnnualRevenue FROM Account WHERE Name like \''+name+'%\'');
    records= str.getArray("records");
    alert('1'+records);}
    else{
    var str = sforce.connection.query('SELECT id,Name,AnnualRevenue FROM Account');
    records=str.getArray("records");
    alert('2'+records);}
    </script>
    <apex:form >
    <apex:actionFunction name="ApexMethod" action="search()" rerender="accountTable"/>
    <apex:pageBlock >
    <apex:outputText value="Account Name"/>
    <apex:inputText value="{!name}" onkeyup="ApexMethod" />
    <apex:pageBlockSection id="accountTable" columns="3">
    <apex:pageblocktable value="{!accounts}" var="acc">
    <apex:column value="{!acc.Name}"/>
    <apex:column value="{!acc.id}"/>
    <apex:column value="{!acc.AnnualRevenue}"/>

    </apex:pageblocktable>
    </apex:pageBlockSection>

    </apex:pageBlock>
    </apex:form>
    </apex:page>

    Controller here is only used for printing list of accounts.

    murthy replied 8 years, 11 months ago 3 Members · 3 Replies
  • 3 Replies

  • Vikas Kumar

    Member
    January 20, 2017 at 2:30 PM

    Hi sushant,

    Try the following code

    CONTROLLER

    public with sharing class SearchJavascriptController {

    public list<Account>accountlist { get; set; }
    public SearchJavascriptController()
    {
    accountList = new list<Account>();
    accountList =[Select Name,Id,AnnualRevenue From Account];
    }

    }

     

    VF Page

    <apex:page controller="SearchJavascriptController">
    <html>
    <head>
    <style>

    * {
    box-sizing: border-box;
    }

    #myInput {
    background-image: url('/css/searchicon.png');
    background-position: 10px 10px;
    background-repeat: no-repeat;
    width: 100%;
    font-size: 16px;
    padding: 12px 20px 12px 40px;
    border: 1px solid #ddd;
    margin-bottom: 12px;
    }

    #myTable {
    border-collapse: collapse;
    width: 100%;
    border: 1px solid #ddd;
    font-size: 18px;
    }

    #myTable th, #myTable td {
    text-align: left;
    padding: 12px;
    }

    #myTable tr {
    border-bottom: 1px solid #ddd;
    }

    #myTable tr.header, #myTable tr:hover {
    background-color: #f1f1f1;
    }
    </style>
    </head>
    <body>

    <apex:form id="theForm">
    <apex:pageBlock >
    <h2>My Account</h2>
    <input type="text" id="myInput" onkeyup="myFunction()" placeholder="Search for names.." title="Type in a name">
    </input>
    </apex:pageBlock>
    <table id="myTable">
    <tr>
    <th><h1> ACCOUNT NAME</h1></th>
    <th><h1> ACCOUNT ID</h1></th>
    <th><h1>ANNUAL REVENUE</h1></th>
    </tr>
    <apex:repeat value="{!accountList}" var="acc" id="theRepeat">
    <tr>
    <td>{!acc.name}</td>
    <td>{!acc.id}</td>
    <td>{!acc.AnnualRevenue}</td>
    </tr>
    </apex:repeat>
    </table>
    <script>
    function myFunction() {
    var input, filter, table, tr, td, i;
    input = document.getElementById("myInput");
    console.log(input);
    filter = input.value.toUpperCase();

    table = document.getElementById("myTable");
    tr = table.getElementsByTagName("tr");
    for (i = 0; i < tr.length; i++) {
    td = tr[i].getElementsByTagName("td")[0];
    if (td) {
    if (td.innerHTML.toUpperCase().indexOf(filter) > -1) {

    tr[i].style.display = "";
    } else {
    tr[i].style.display = "none";
    }
    }
    }
    }
    </script>
    </apex:form>
    </body>
    </html>

    </apex:page>

     

  • sushant

    Member
    January 23, 2017 at 8:05 AM

    Thanks

  • murthy

    Member
    February 20, 2017 at 2:50 AM

    Besides, the Governor limits, is there a good reason to bring in all of the rows in the Account? Where will they be stored? In some server cache?

    Thanks

Log In to reply.

Popular Salesforce Blogs

Popular Salesforce Videos