Multiple Search works correctly individually but combined my existing code it will work.
Multiple Search works correctly individually but combined my existing code it will work.
Arun Lal
Posts: 3Questions: 2Answers: 0
Thanks for your Support,
This is my design page Code for searching multiple column data in each and every column through DataTable.
When used only your Example Code it will work nice and great but when implement that one to my Below code it will not working.
I don’t know which Javascript and css links are come 1st.
Can you Help me to arrange the code in proper order.
<%@ Page Title="" Language="C#" MasterPageFile="~/SalesApp.master" AutoEventWireup="true"
CodeFile="AddLead.aspx.cs" Inherits="AddLead" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
<style type="text/css" title="currentStyle">
** tfoot {
display: table-header-group;
}**
@import "DataTables/media/css/demo_page.css";
@import "DataTables/media/css/DT_bootstrap.css";
</style>
**<script type="text/javascript" src="DataTables/media/js/jquery-1.12.3.js"></script>
<script type="text/javascript" src="DataTables/media/js/jquery.dataTables.min.js"></script>
<link href="DataTables/media/css/jquery.dataTables.min.css" rel="stylesheet" />**
<script type="text/javascript” src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script type="text/javascript" language="javascript" src="DataTables/media/js/jquery.js"></script>
<script type="text/javascript" language="javascript" src="DataTables/media/js/jquery.dataTables.js"></script>
<script type="text/javascript" language="javascript" src="DataTables/media/js/DT_bootstrap.js"></script>
<link rel="Stylesheet" href="font-awesome/css/font-awesome.min.css" type="text/css" />
<link rel="Stylesheet" href="DataTables/media/css/jquery.dataTables.min.css" type="text/css" />
<script type="text/javascript" charset="utf-8">
$(document).ready(function () {
// Setup - add a text input to each footer cell
$('#leadGrid tfoot th').each(function () {
var title = $(this).text();
$(this).html('<input type="text" placeholder="Search ' + title + '" />');
});
$('#StaffList').hide();
var oTable = $('#leadGrid').dataTable({
.
.
.
});
function CleanLook() {
$('#leadGrid').each(function () {
.
.
});
}
$('table th input:checkbox').on('click', function () {
.
.
});
$('#<%=cmdResponseToLead.ClientID %>').click(function () {
.
.
});
$('#<%=btndeletelead.ClientID %>').click(function () {
.
.
});
function OnChangeAssignLead(dropdown)
{
.
.
}
**// DataTable
var table = $('#leadGrid').DataTable();
// Apply the search
table.columns().every(function () {
var that = this;
$('input', this.footer()).on('keyup change', function () {
alert("aa");
if (that.search() !== this.value) {
that
.search(this.value)
.draw();
}
});**
});
</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<table class="new-table">
<tr>
<td>
<asp:Panel ID="Panel2" runat="server" Style="top: 0px; left: 6px;">
<table class="table-header-content">
<tr>
<td>
<table class="table-header-search">
<tr class="search-lead">
<td class="searchlabel-align">
<asp:Label ID="Label1" runat="server" Text="Search By"></asp:Label>
</td>
<td class="searchbox-align">
<asp:DropDownList ID="ddlshowlead" runat="server" AutoPostBack="True" class="form-control input-small search-lead-box"
OnSelectedIndexChanged="ddlshowlead_SelectedIndexChanged">
</asp:DropDownList>
</td>
<td class="selectbox-align">
<asp:DropDownList ID="ddlsearchbylead" runat="server" >
</asp:DropDownList>
</td>
<td class="textbox-align">
<asp:TextBox ID="txtsearchLead" runat="server" ></asp:TextBox>
</td>
<td class="searching-buttons">
<asp:Button ID="btnsearchlead" runat="server" Style="" Text="Search"
OnClick="btnsearchlead_Click"></asp:Button>
</td>
<td class="content-header-name-lead">
<span>Lead List</span>
</td>
</tr>
</table>
</td>
</tr>
</table>
</asp:Panel>
</td>
</tr>
<tr>
<td>
<asp:Panel ID="Panel9" runat="server">
<table cellpadding="0" cellspacing="0" border="0" class="table table-striped table-bordered"
id="leadGrid">
<thead>
<tr>
<th class="center" >
<label>
<input type="checkbox" />
<span class="lbl"></span>
</label>
</th>
<th >Slno
</th>
<th >First Name
</th>
<th>Last Name
</th>
<th >Organization Name
</th>
<th >City
</th>
<th>State
</th>
<th >Phone
</th>
<th>Lead Added Date
</th>
<th >Callback Date
</th>
<th >Time
</th>
<th >Responses
</th>
<th>Sales Staff
</th>
<th >Lead Status
</th>
<th >Title
</th>
</tr>
</thead>
**<tfoot>
<tr>
<th></th>
<th>ContactID</th>
<th>First Name</th>
<th>Last Name</th>
<th>Organisation Name</th>
<th>City</th>
<th>State</th>
<th>Phone</th>
<th>Lead Added Date</th>
<th >Callback Date</th>
<th >Time</th>
<th >Responses</th>
<th>Sales Staff</th>
<th >Lead Status</th>
<th >Title</th>
</tr>
</tfoot>**
<tbody>
<tr>
<td colspan="15" class="dataTables_empty">Loading data from server
</td>
</tr>
</tbody>
</table>
</asp:Panel>
</td>
</tr>
</table>
<asp:Panel ID="Panel4" runat="server">
<table id="Table1">
<tr>
<td>
<asp:Button ID="cmdResponseToLead" runat="server" CssClass="btn btn-sm btn-primary"
OnClick="cmdResponseToLead_Click" Text="Response To Lead" />
<asp:RadioButtonList ID="RblResponseToLead" runat="server" EnableViewState="False"
RepeatDirection="Horizontal" RepeatLayout="Flow" CssClass="radioButton">
</asp:RadioButtonList>
<asp:HiddenField ID="hiddenContactIds" runat="server" />
<asp:HiddenField ID="hiddenContactNames" runat="server" />
<asp:HiddenField ID="hiddenMergeContactId" runat="server" />
</td>
</tr>
</table>
</asp:Panel>
</asp:Content>
Please Help me it’s very urgent ..
Thanks,
Arun Lal
Answers
Plz anyone help me..