How to create autocomplete with data from code behind? - c#

In my Main.aspx.cs i have a XmlDocument. With:
var personName = dataXml.SelectNodes("/GetDocumentsResult/Person/Name");
string[] perNames = new string[personName .Count];
for (int i = 0; i < personName .Count; i++)
{
perNames[i] = personName [i].InnerText;
}
i get the names of all persons.
In Main.aspx i have a search input:
<div data-role="fieldcontain" style="LEFT:15px;TOP:10px;">
<input name="suche" id="searchinput1" value="" type="search">
</div>
There are many links with autocomplete such as this link , but i dont know how to use perNames in aspx.

You need to use JQuery for the front end part, as is pretty straight forward, then you need to use AJAX to get a list of data, and then you got your business and backend part as is usual business. Take a look here.
http://www.aspsnippets.com/Articles/Using-jQuery-AutoComplete-Plugin-in-ASP.Net.aspx

Related

Verify Order Of HTML Elements With Attribute Values Such as Class="Group0-Item1" Class="Group0-Item2" Class="Group1-Item1"

In my Selenium/C#/NUNIT project, I need to find a way to validate the order (top down hierarchy of a page's HTML) for a group of HTML elements (as well as the elements contained within those groups). These are my elements that show inside my page's HTML...
<div class="gapBanner-banner-order1-group0"></div>
<div class="gapBanner-banner-order1-group1"></div>
<div class="gapBanner-banner-order1-group2"></div>
<div class="gapBanner-banner-order2-group2"></div>
The validation I want to perform should be able to catch the following bugs:
Bug 1: The groups are not in order within the page's HTML. One of the elements that is in group1 appears first in the HTML before group0...
<div class="gapBanner-banner-order1-group1"></div>
<div class="gapBanner-banner-order1-group0"></div>
<div class="gapBanner-banner-order1-group2"></div>
<div class="gapBanner-banner-order2-group2"></div>
Bug #2: The elements WITHIN each group are not in order within the page's HTML. Group2-Order2 appears before Group2-Order1 within the HTML
<div class="gapBanner-banner-order1-group0"></div>
<div class="gapBanner-banner-order1-group1"></div>
<div class="gapBanner-banner-order2-group2"></div>
<div class="gapBanner-banner-order1-group2"></div>
The below is what I have coded so far, but it is definitely not going to do the job, not to mention, it is very messy. I cant figure out what kind of logic I need for this
/// 5. Verify the correct order of elements in which they appear inside the HTML
List<IWebElement> CustomPageHTMLComponents = Browser.
FindElements(By.XPath("//div[contains(#class, 'group')")).ToList();
List<IWebElement> uniqueGroups = new List<IWebElement>();
// Get the unique groups
for (int i = 0; i < CustomPageHTMLComponents.Count; i++)
{
IWebElement currentComponent = Browser.FindElements(By.XPath("//div[contains(#class, 'group')"))[i];
string toBeSearched = "group";
string currentComponenetClassAttributeValue = currentComponent.GetAttribute("class");
int x = currentComponenetClassAttributeValue.IndexOf(toBeSearched);
string groupNumber = currentComponenetClassAttributeValue.Substring(x + toBeSearched.Length);
if (groupNumber == i.ToString())
{
uniqueGroups.Add(currentComponent);
}
}
// Some kind of logic to verify everything???
for (int i = 0; i < Page.CustomPageHTMLComponents.Count; i++)
{
IWebElement currentComponent = Browser.FindElements(By.XPath("//div[contains(#class, 'group')"))[i];
string toBeSearched = "group";
string currentComponenetClassAttributeValue = currentComponent.GetAttribute("class");
int x = currentComponenetClassAttributeValue.IndexOf(toBeSearched);
string groupNumber = currentComponenetClassAttributeValue.Substring(x + toBeSearched.Length);
Assert.AreEqual(groupNumber, i.ToString());
}
There are probably a number of ways to do this. This is the first way I came up with...
Grab all the class names from the desired elements and store them in string array #1
Make a copy of string array #1 and sort it
Compare the two arrays and if they are equal, then they were sorted to start with
I've checked the HTML you provided for the bugs you'd like to catch and it catches them all. The one issue I can think of is if you get more than 9 orders or groups the sorting will not be what you want because it's alpha order not numerical order, e.g. 1, 10, 2, ... instead of 1, 2, ... 10.
// capture the class names from the desired classes
string[] elements = _driver.FindElements(By.CssSelector("div[class^='gapBanner-banner-']")).Select(e => e.GetAttribute("class")).ToArray();
// make a copy of the array
string[] sortedElements = new string[elements.Length];
elements.CopyTo(sortedElements, 0);
// sort the copy
Array.Sort(sortedElements);
// compare the arrays for order using NUnit CollectionAssert
CollectionAssert.AreEqual(elements, sortedElements, "Verify ordering of elements");

asp.net posting from view to List<> on server side

I'm a beginner. I'm still studying. I have made this code, which works as intended.
However, for each time I go back to another page, it can not, of course, save it to a list.
It disappears directly after I'm gone from this page.
The server page looks like this
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult pizaCart(string pizaName, string pizaDesc, string pizaPrice)
{
List<pizaModel> cartList = new List<pizaModel>();
toCart.CartList = cartList;
pizaName = Request.Form["pizaName"];
pizaDesc = Request.Form["pizaDesc"];
pizaPrice = Request.Form["pizaPrice"];
cartList.Add(new pizaModel { name = pizaName, desc = pizaDesc, price = pizaPrice });
return View(toCart);
}
html page looks like this.
<form action="piza" method="post">
<input class="n" type="text" name="pizaName" id="pizaName" value="" /><br />
<input class="n" type="text" name="pizaDesc" id="pizaDesc" value="" /><br />
<input class="n" type="text" name="pizaPrice" id="pizaPrice" value="" /><br />
<button class="btn">add</button>
</form>
"I have tried to google it and look for it lots of places, but havent found any good enough answer"
-- hmm i probably need a loop somewhere?
As you can see, it's a very simple way to post data to list. Is it possible that I can keep adding to my list? (Maybe it has something to do with lifecycle). Thank you very much for your time.
When you call
new List<pizaModel>()
...you are creating a new list. A new list has zero elements.
Immediately after that you call
cartList.Add(new pizaModel { name = pizaName, desc = pizaDesc, price = pizaPrice });
...which adds the current item to the list, which results in a list with one item.
There is no notion in this code of adding to an existing list, and it will never contain more than one item.
You will need to figure out some way of keeping the list from action to action. For example, you could persist the list in the browser and then post the whole list as JSON. Or you could store the list in a session variable or database table on the server side.
You may use sessions as below
Session["myPizza"] = cartList ;
Then cast it from the end of your Action result as below
var SelectedList = (List<pizaModel>)Session["myPizza"];

How to add viewbag parameter in a href?

I tried to add item.DetailPageURL which is an url to href in this view:
<h2>Search for #ViewBag.Keyword</h2>
#for(int i = 0; i < 13; i++)
{
var item = ViewBag.SearchedItems[i];
<div>
<h2>#item.Title</h2>
<img src="#item.SmallImage" alt="Image is missing"/>
<p>Items price:</p>
<p>#item.Price</p>
<p>#item.CurrencyCode</p>
<p><a href='#item.DetailPageURL'></a>Details</p>
<p>#item.CustomerReview</p>
</div>
<hr>
}
but it does not work. What am I doing wrong?
You are talking about the below line. Did you noticed that you have used single quote '. In which case, variable substitution won't happen actually.
<p><a href='#item.DetailPageURL'></a>Details</p>
You need to use double quote " like
<p>Details</p>
Also, I would cast the ViewBag.SearchedItems to it's actual type and use a foreach loop rather like below (assuming it's List<string> type)
foreach(var item in (List<string>)ViewBag.SearchedItems)
{
// add to the view
}
As You can see, the problem is in html.
<p>Details</p>
The link is active, but it isn't appear, because "Details" is out of tag.
Should be like this:
<p>Details</p>
Thank You in advance!

Loop list in jquery and use the looped values

In my last question I was having problems looping through a list with jQuery. Then we figured this out and it worked perfectly:
public List<Sale> AllSales { get; set; }
for (var i = 0; i < <%= AllSales.Count %>; i++) {
}
I now need to use the values inside the loop so I thought it would be as simple as this :
for (var i = 0; i < <%= AllSales.Count %>; i++) {
var date = <%= AllSales[i].Date %>;
alert(date);
}
When I first tried this, it said "The name 'i' does not exist in the current context
", so I just put 0 instead of i instead of AllSales[0]. Then nothing happens.
What am I missing?
You have javascript loop which you want to iterate on server side list this is not possible. You can use ajax to send data to client side. This is a nice article for using jQuery ajax with csharp.
Assigning the values of your list separated with comma to some hidden field and accessing that hidden field in javascript could be a possible solution. But if you want to use more attributes of your list object then it would be very messy solution. Using ajax is best option.

Find span tag in table in c#

<table id="mytable" runat="server">
<tr class="csstablelisttd">
<td>
08:00
</td>
<td>
00
</td>
<td>
<span></span>
</td>
</tr>
for(int i = 0; i < mytable.Rows.Count - 1; i++)
{
for(int j = 0; j < mytable.Rows[i].Cells.Count; j++)
{
}
}
if(mytable.Rows[i].Cells[j].Attributes["class"] != null && mytable.Rows[i].Cells[j].Attributes["class"].Equals("csstdgreen"))
{
//For finding class of td.I use above code
}
I have to find span tag in table and have to add text in span tag.
which is in td of table.
i dont want to apply runat="server" because there are 50 span in my tabel.
i am looping through table like this.I have search google lot but didnt find anything in c#.
i have to put value in span tag from database
Note : No Javascript or Jquery !
you've got to use a asp:Label or put runat="server" on your <span> or generate your span from code-behind
//Just an hint, can't remember the proper way to do this but you can
myTable.Rows[i].Cells[last].InnerHtml = "<span>value</span>";
that gives you another option/idea
When using jQuery, give all you span's a className and the TD an ID
<td id="idOfTd">
<span class="className">Blabla</span>
</td>
In jQuery u can do the following:
var allSpans = $('#idOfTd .className');
If you want to add text in span in code behind then as I know its too tuff without using runat="server". but if you want to add text in javascript then it can be done....by searching span using getElementusingTagName('span') inside td and add text to it.
For doing this in javascript you don't have need to give id to span as well as no need to write runat ="server".
below javascript code is written -
<script type="text/javascript">
function getInfo()
{
var mygetTable = document.getElementById("<%=mytable.ClientID %>");
for (var j = 0; j < mygetTable.rows.length; j++)
{
var abc = mygetTable.rows[j].cells[2].getElementsByTagName('span');
abc[0].innerHTML = 'I am Span.';
}
}
</script>
Give the TD or span an ID and add the data in it by code behind
If you don't want to use the server control, maybe javascript is a better idea to do this job.
Firstly give each span an unique id, say like the one given below...
<td>
<span id="span1"></span>
</td>
and then using javascript you can find this span and add the required text, some thing like
document.getElementById('test').innerHTML = 'your required message can go here';
here is a small fiddle link to it = http://fiddle.jshell.net/fFHbf/
If you can set an id to each tag, you could do something like this:
HTML:
<span id="spanTagId"></span>
Then, with java script:
document.getElementById('spanTagId').innerHTML = 'Your text...';
If you want to add text in span in code behind then as I know its too tuff without using runat="server". but if you want to add text in javascript then it can be done....by searching span using getElementusingTagName('span') inside td and add text to it. For doing this in javascript you don't have need to give id to span as well as no need to write runat ="server". below javascript code is written -
<script type="text/javascript">
function getInfo()
{
var mygetTable = document.getElementById("<%=mytable.ClientID %>");
for (var j = 0; j < mygetTable.rows.length; j++)
{
var abc = mygetTable.rows[j].cells[2].getElementsByTagName('span');
abc[0].innerHTML = 'I am Span.';
}
}
</script>

Categories