var  CmalQuery="";
var fieldName="";
$(document).ready(function () {

    $('#btnSearch').on('click', function () {
        txtValue = $('#txtSearch').val();
         fn();
    });
     $('#btnList').on('click', function () {
        fn1();
    });
     $('select').on('change', function () {
       ListName = this.value;
       retrieveFieldsOfListView(ListName);
       txtValue = $('#txtSearch').val();
         // or $(this).val()
    });
    });



function fn() {
    var context = SP.ClientContext.get_current();
    var user = context.get_web().get_currentUser();
    //Get the Announcements list. Alter this code to match the name of your list
    var list = context.get_web().get_lists().getByTitle(ListName);
    //Create a new CAML query
    var caml = new SP.CamlQuery();
    //Create the CAML that will return only items with the titles that contains with 'txtValue'
   // var CmalQuery = "<View><Query><Where><Or>";
   // CmalQuery += "<Contains><FieldRef Name='EmpName' /><Value Type='Text'>" + txtValue + "</Value></Contains>";
   // CmalQuery += "<Contains><FieldRef Name='Company' /><Value Type='Text'>" + txtValue + "</Value></Contains>";
   // CmalQuery += "</Or></Where></Query></View>"
    caml.set_viewXml(CmalQuery);
    //Specify the query and load the list oject
   var returnedItems = list.getItems(caml);
    context.load(returnedItems);
    //Run the query asynchronously, passing the functions to call when a response arrives
    context.executeQueryAsync(onQuerySuccess, onQueryFail);
    function onQuerySuccess(sender, args) {
        //Get an enumerator for the items in the list
        var enumerator = returnedItems.getEnumerator();
        //Formulate HTML from the list items
        var markup = 'Items in the Employee Details list that contains with ' + '"' + txtValue + '"' + ': <br><br><table class="table table-striped">';
               //Loop through all the items
        while (enumerator.moveNext()) {
            var listItem = enumerator.get_current();
            markup += '<tr><td>' + listItem.get_item(fieldName).get_lookupValue() + '</td></tr>';
           // markup += '<td>' + listItem.get_item('JobTitle') + '</td>';
          //  markup += '<td> ' + listItem.get_item('Title') + '</td> ';
          //  markup += '<td>' + listItem.get_item('ManagerName').get_lookupValue() + '</td></tr>';
            //Display the formulated HTML in the displayDiv element
        }
        markup += '</table>'
        $('#resultsDiv').html(markup);
    }
    function onQueryFail(sender, args) {//Formulate HTML to display details of the error
        var markup = '<p>The request failed: <br>';
        markup += 'Message: ' + args.get_message() + '<br>';
        //Display the details
        $('#resultsDiv').html(markup);
    }


}
function fn1() {
    var context = SP.ClientContext.get_current();
    var user = context.get_web().get_currentUser();
    var oWebsite = context.get_web();
    this.collList = oWebsite.get_lists();
    context.load(collList);

    context.executeQueryAsync(onQuerySucceeded,onQueryFailed);
    function onQuerySucceeded() {
        var listInfo = '<table class="table table-striped"><tr>';
        var listEnumerator = collList.getEnumerator();

        while (listEnumerator.moveNext()) {
            var oList = listEnumerator.get_current();

            listInfo += '<tr><td>Title: ' + oList.get_title() + '</td></tr>';

           $("#ddlTitles").append($("<option></option>").html(oList.get_title()));
        }
        listInfo +='</tr></table>'
         $('#resultsDiv').html(listInfo);



    }
    function onQueryFailed(sender, args) {
        alert('Request failed. ' + args.get_message() +
            'n' + args.get_stackTrace());
    }
}

function retrieveFieldsOfListView(ListName) {

    var context = new SP.ClientContext.get_current();
    var web = context.get_web();
    var list = web.get_lists().getByTitle(ListName);
    var view = list.get_views().getByTitle('All Items');
    var listFields = view.get_viewFields();
    context.load(listFields);
    context.executeQueryAsync(printFieldNames, onError);


    function printFieldNames() {
        var e = listFields.getEnumerator();
      CmalQuery += "<View><Query><Where><Contains><Or>";
        while (e.moveNext()) {
            fieldName = e.get_current();

            CmalQuery += "<FieldRef Name='"+fieldName+"' /><Value Type='Text'>" + txtValue + "</Value>";

            console.log(fieldName);

        }
          CmalQuery += "</Or></Contains></Where></Query></View>";
    }

    function onError(sender, args) {
        console.log(args.get_message());
    }
    }

CmalQuery += "<FieldRef Name="+fieldName+" /><Value Type=Text>" + txtValue + "</Value>";

CmalQuery += "<View><Query><Where><Contains><Or>";
        while (e.moveNext()) {
            fieldName = e.get_current();

            CmalQuery += "<FieldRef Name='"+fieldName+"' /><Value Type='Text'>" + txtValue + "</Value>";

            console.log(fieldName);

        }
          CmalQuery += "</Or></Contains></Where></Query></View>";

<View><Query><Where><Contains>
<Or>
  <FieldRef Name='fieldName1' /><Value Type='Text'>txtValue1</Value>
  <FieldRef Name='fieldName2' /><Value Type='Text'>txtValue2</Value>
  <FieldRef Name='fieldName3' /><Value Type='Text'>txtValue3</Value>
</Or>
</Contains></Where></Query></View>

<View><Query><Where><Contains>
  <Or>
    <Or>
      <FieldRef Name='fieldName1' /><Value Type='Text'>txtValue1</Value>
      <FieldRef Name='fieldName2' /><Value Type='Text'>txtValue2</Value>
    </Or>
    <FieldRef Name='fieldName3' /><Value Type='Text'>txtValue3</Value>
  </Or>
 </Contains></Where></Query></View>

<Or>
      <Eq><FieldRef Name='Status' /><Value Type='Text'>(3) TestStatus3</Value></Eq>
       <Eq><FieldRef Name='Status' /><Value Type='Text'>(2) TestStatus2</Value></Eq>
 </Or>

<And>
    <Or>
      <Eq><FieldRef Name='Status' /><Value Type='Text'>(3) TestStatus3</Value></Eq>
       <Eq><FieldRef Name='Status' /><Value Type='Text'>(2) TestStatus2</Value></Eq>
    </Or>
    <Eq><FieldRef Name='Status' /><Value Type='Text'>(1) TestStatus1</Value></Eq>
</And>