I have a asp.net application.The requirement is to provide a live search functionality to search a particular list of products.
I searched various live search jquery plugins and used this
http://nakajima.github.com/jquery-livesearch/
In the above mentioned link , the data is in ul li format and then the live search is implemented on that list, so what I did is in the backend, from server side, used a repeater control, like below
<ul id="names">
<asp:Repeater ID="SomeRepeater" runat="server" OnItemCommand="SomeRepeater_ItemCommand" Visible="false">
<ItemTemplate>
<li>
<asp:LinkButton ID="SomeLink" runat="server" CommandName="Load" CommandArgument='<%# Eval("SomeId")%>' Text='<%# Eval("SomeNameName") + " " + "("+ Eval("SomeCount") + ")" %>'></asp:LinkButton>
</li>
</ItemTemplate>
</asp:Repeater>
After this in the code behind, binded the repeater control with a List object for the data.
After all this the live search functionality was completely working fine with the values in repeater control as ul li.
now , the requirement is changed and I need to hide the ul li values which I am binding to repeater control, but want the live search for the same listobject.
For this I searched over the internet and got an idea, instead of using the repeater control, let me use a JSon , I am successful in getting the values as a string from the below code
JavaScriptSerializer jss = new JavaScriptSerializer();
string output = jss.Serialize(newListObject);
but the problem is , I cannot use the jquery plugin which I have mentioned above and I am not sure how to do the same search functionality using above json string.
Please let me know if my approach is correct also, how to go about achieving the same.
It sounds like jQuery Autocomplete will do exactly what you need. It's also fairly easy to integrate with .NET, you just return a list of strings.
Alternatively, you can declare a static list of autocompleteable items. You can also trigger changes/redirect when an item is clicked.
Related
I know its maybe unusual, but i want add htmlGenericControl to a div (it's outside a repeater) in ItemDataBound from CodeBehind..
HtmlGenericControl slider = (HtmlGenericControl)e.Item.FindControl("slider");
htmlGenericControl input = new HtmlGenericControl("input");
input.Attributes.Add("type", "radio");
input.Attributes.Add("name", "slide_switch");
input.Attributes.Add("id", string.Format("projectImage-{0}", item.ProjectImageId));
slider.Controls.Add(input);
but its return null everytime. this is the aspx code:
<div class="slider">
<asp:Repeater ID="rptProjectImages" runat="server" OnItemDataBound="rptProjectImages_ItemDataBound">
<ItemTemplate>
</ItemTemplate>
</asp:Repeater>
</div>
Didnt work with asp.net too long, but probably this should help
<div id="myDiv" runat="server">...</div>
and in codebehind myDiv should be accessible.
Several issues with this code.
First, your div is client-side only, from server-side point of view it's just a string. Turn it into server-side control with:
<div class="slider" runat="server" ID="slider">
Second, FindControl looks for immediate children only, in your case children of the repeater item. slider is not one of those. Moreover, it is not a part of the repeater item template and should be accessible as in in code behind, so just
slider.Controls.Add(...
That is unless slider and the repeater you showed are a part of some other template of some "outer" control. In which case make sure to use that "outer" control to call FindControl on.
Finally, don't mess with id. I bet this is either going to be overridden by ASP.NET, or will cause issues on the page. Instead set client ID mode to static and assign ID property:
input.ClientIDMode = ClientIDMode.Static;
input.ID = string.Format("projectImage_{0}", item.ProjectImageId);
This is eventually output the same value for id you needed, but in more ASP.NET compliant way. One note though is that I replaced "-" with "_" - server side controls cannot have hyphens in ID
FindControl finds a control within another, but does so looking for the control's id. Your "slider" control has no id, it uses a class named "slider" but has no id.
You will need to define the control as
<div runat="server" id="Slider" class="slider">
<asp:Repeater ID="rptProjectImages" runat="server" OnItemDataBound="rptProjectImages_ItemDataBound">
<ItemTemplate>
</ItemTemplate>
</asp:Repeater>
</div>
The runat="server" tells the framework to instantiate that control in your code behind. The id will be the name of the object that is that control. Then in your code, you can do
htmlGenericControl input = new HtmlGenericControl("input");
input.Attributes.Add("type", "radio");
input.Attributes.Add("name", "slide_switch");
input.ID = string.Format("projectImage-{0}", item.ProjectImageId);
Slider.Controls.Add(input);
I'm just learning ASP.Net, so I hope that you bear with me and my questions. In my program, I have a dataset that contains Url strings that point to various images. My question is, can I use that dataset as a datasource for a Repeater control so that the Repeater uses those Urls to display the images?
Thanks so much for any help and advice.
You most certainly can. You will want to do the binding in the code-behind, probably in the Load method like this:
repeaterControl.DataSource = yourDataSet.Tables[0];
repeaterControl.DataBind();
where 0 is the index of the DataTable you're trying to get to.
Then you'll want to build the markup something like this:
<asp:Repeater ID="repeaterControl" runat="server">
<ItemTemplate>
<asp:Image runat="server"
ImageUrl="<%# DataBinder.Eval(Container.DataItem, "TheFieldName") %>" />
</ItemTemplate>
</asp:Repeater>
where TheFieldName is the name of the field/column in the DataTable that contains the URL. Now, this code may need to be debugged a little bit because I didn't build an entire project around this, but this will get you 99% of the way there, if not all of the way.
this is definitely an easy question but I still don't know what exactly it is for. Can anybody tell me what ImageUrl='<%# Eval("FileName") %>' means? I still don't get the idea why we need to include %#.
<%# Eval("FileName") %> is used in the context of binding data from a collection to a control. Probably the value for the imageurl is coming from a property of an object in the collection
For example, List<Photo> where Photo has a property of FileName. If you are binding that to a gridview, a repeater, etc, you'll access that property for each item in the collection when binding to such controls
Asp.net data binding overview
in this Line...
ImageUrl='<%# Eval("FileName") %>'
ImageURL the attribute of your asp:ImageButton control that is used to specify the Url of the Image File to be Used
Code between '<% and %>' tags are writtent to be Executed on the Server
'#' is used to specify that the result of server side execution will be bound hear
Eval KeyWord is Used To Evaluate the perticular Column Value (that you specify ("--hear--")) from The DataSourse
When you are using a Template Control like Repeater , GridView , etc. you are actually iterating in a list of data records, and <%# Eval("FileName") %> here means give me the value of the column named FileName.
Here we have used the Eval function which is used for one way databinding. FileName is the field name you are associating. Anything that's written inside <%# %> is parsed by asp.net engine before generating the webpage source which is pure client side script and html tags.
So Eval function is executed at server end by ASP.net engine.
I have ASP.NET GridView in my web app and would like to bind two fields into one column and use string formatting. I am providing example below, is it possible to implement into GridView?
I have two data fields Name and DefaultParam and would like to display these fields into one GridView column.
Like this
Name=DefaultParam
If DefaultParam value is empty I would like to show only Name value and do not include =
I was using Repeater and code below to achieve this but now decided to move data display to GridView
<%#Eval("Name")%>
<%# (!string.IsNullOrEmpty(Eval("DefaultParam").ToString())) ? "= " + Eval("DefaultParam"):"" %>
You can use a TemplateField and put your logic in there:
<asp:TemplateField HeaderText="Header">
<ItemTemplate>
<%#Eval("Name") + (!string.IsNullOrEmpty(Eval("DefaultParam").ToString())) ? "= " + Eval("DefaultParam"):""%>
</ItemTemplate>
</asp:TemplateField>
Another option would be to use a Property on your object to do that logic for you behind the scenes and just use that as a BoundField, but you didn't mention what the object is your binding is.
You can simple write server-side code between <%# ... %> as you write in code behind. just put it in '' (between single quotes) .
<asp:Lable id="lblxx" runat="server"
Text='<%# Eval("Name") + (!string.IsNullOrEmpty(Convert.ToString(Eval("DefaultParam")))) ? "= " + Eval("DefaultParam"):"" %>' />
Follow this tutorial link to know that how to Custom Formatting Based Upon Data using Template Fields.
I am working on an asp.net web application where I have predefined panel in my project with
CSS. Now i want to create another panel with same design and CSS at run time at multiple times. I have a button control when i will click that button it will add another panel.
Please help me to add another panel with same criteria.
If it is something that you plan on reusing, I'd suggest you utilize a user control for this. You can them simply add a new instance of the control on your page.
A few things worth looking into:
https://web.archive.org/web/20210707024005/http://aspnet.4guysfromrolla.com/articles/081402-1.aspx
http://aspalliance.com/565
http://msdn.microsoft.com/en-us/library/c0az2h86.aspx
If you wanted to accomplish this with a postback to the page, add this to your event...
//MyControl = Custom User Control
var myControl = (MyControl) Page.LoadControl("MyControl.ascx");
this.ControlContainer.Controls.Add(myControl);
Like RSolberg said, you could write a User Control and add it multiple times:
<my:UserControl id="MyControl1" runat="server" />
<my:UserControl id="MyControl2" runat="server" />
<my:UserControl id="MyControl3" runat="server" />
Of course, your User Control can be as simple or as complex as you like, thus having repeated functionality on your page.
However, depending on your exact needs you might want to consider something like an ASP.NET Repeater, or ListView, or DataGrid control. With something like a Repeater, you can bind data to it, and have that data be displayed in a list/grid, that has a common look and feel. You can give your Repeater a HTML/CSS template for the header, items, and footer sections too to make it look consistent and professional.
<asp:Repeater id="MyRepeater" runat="server">
<HeaderTemplate>
<h1>Products</h1>
</HeaderTemplate>
<ItemTemplate>
<p>
Product name: <%# Eval("ProductName") %>
</p>
</ItemTemplate>
</asp:Repeater>
and in your code just do this:
MyRepeater.DataSource = products;
MyRepeater.DataBind();
There are many ways of doing what you're asking in ASP.NET - be a bit more specific and we'll be able to give you more specifc help.
Couldn't you just create a new panel in the code behind on the button's "On_Click" event? That would be my suggestion. You may need to have a placeholder to add the panel into something so it appears on the page.