What is the best way to display repeated codeblocks in vb.net? - asp.net

I'm quite new to asp.net and vb.net, so my apologies if I do not use the correct terminology here.
I have a database table and for each row in a returned dataset from that table I want to produce some HTML code eg:
<div>
<img src="SOURCE" />
<h1>Row1</h1>
<input type="button" />
<input type="button" />
</div
<div>
<img src="SOURCE" />
<h1>Row2</h1>
<input type="button" />
<input type="button" />
</div
What would be the best way to do this? Do I simply pull back an object with the entire data and then write a foreach loop to iterate through each row and insert a string to the page, or should I be looking to use a user control?
I guess I'm trying to make a sort of forum listing page and want to fetch all topics with a particular entry in a database and then display this list on a page with some input controls and an image. I also want to add pagination; so to show only 10 posts at any time and then be able to paginate to the next page.
Again I apologise if I've not been very clear, but I'm having a little bit of a hard time understanding the best way to tackle this.

You could use a Repeater.
<asp:Repeater id="Repeater1" runat="server">
<ItemTemplate>
<img src="SOURCE" />
<h1>Row<%# Container.ItemIndex %></h1>
<input type="button" />
<input type="button" />
</ItemTemplate>
</asp:Repeater>

If you want any code block to be repeated. Try this code which i uses..
Sample code to display any div 3 times
<% For i as Integer = 1 To 3%>
<div>
<img src="SOURCE" />
<h1>Row1</h1>
<input type="button" />
<input type="button" />
</div> <% Next %>

Related

How do I attach datepickers to text boxes with the same ID?

I have an ASPX that has a repeater. Inside the repeater is a text box with a JQuery datepicker attached to it. The text box's ID is static, so it is the same for all of those items within the repeater. However, when I make a change to the second or subsequent repeater item's date box using a datepicker, it changes the first item's date box and leaves the one actually attached to the selected datepicker alone.
Other than the obvious solution of "don't define items with the same ID," which results in another problem that will probably end up in another question, is there a way to fix this problem?
This example
<asp:Repeater runat="server"
ID="rptWhatever"
ClientIDMode="Predictable">
<ItemTemplate>
<asp:TextBox runat="server"
ID="tbxWhoCares"
CssClass="ImaDatePicker">
</asp:TextBox>
</ItemTemplate>
</asp:Repeater>
Will render the textbox to something like:
<input id="tbxWhoCares" type="text" class="ImaDatePicker"/>
So regardless of the id you should be able to do this in your script:
$(".ImaDatePicker").datepicker();
The problem with non-unique ID's is a big one but should be an easy fix if you set the attributes in the Repeater to ClientIDMode="Predictable" and leave the same attribute in the TextBox to its default.
Update
It seems jquery UI datepicker requires a unique id.
So you can select multiple inputs using a common css class but the id's must be unique otherwise you run into that problem.
It shouldn't work that way...but it does.
Alternatively you could just use the native <input type="date" ... />
$(function() {
$(".ImaDatePicker").datepicker();
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.13.2/themes/base/theme.min.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.13.2/themes/base/jquery-ui.min.css" rel="stylesheet"/><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.13.2/jquery-ui.min.js"></script>
<input id="tbxWhoCares" type="text" class="ImaDatePicker" />
<input id="tbxWhoCares" type="text" class="ImaDatePicker" />
<input id="tbxWhoCares" type="text" class="ImaDatePicker" />
<br><br><br>
<input id="tbxWhoCares_1" type="text" class="ImaDatePicker" />
<input id="tbxWhoCares_2" type="text" class="ImaDatePicker" />
<input id="tbxWhoCares_3" type="text" class="ImaDatePicker" />

Using Validation Tag Helper in ASP.NET 5

I have an ASP.NET 5 app. I'm creating this app as a learning exercise on a Mac. Currently, I'm trying to use the validation tag helper. In my view, I have the following code:
<form method="POST" action="~/account/login">
<h1>Login</h1>
<div class="validation" asp-validation-summary="All" />
#Html.ValidationSummary(false, "", new { })
<input id="Username" name="Username" />
<br />
<input id="Password" name="Password" />
<br />
<button type="submit">Login</button>
#Html.AntiForgeryToken()
</form>
The traditional #Html.ValidationSummary(...) approach works. However, the <div class="validation" asp-validation-summary="All" /> approach does not. I want to break away from using the tradition #Html. approach and use tag helpers as much as possible.
Why won't the validation results appear in the asp-validation-summary?
Thank you!
Since this commit
the ValidationSummaryTagHelper takes a value of the ValidationSummary enum instead of a string
So you need to write:
<div class="validation" asp-validation-summary="ValidationSummary.All" />
See also in the sample on Github.

how to set tooltip to htmlcontrol in codebehind in asp.net

I have a html control like
<input id="Button1" type="button" value="button" />
<input id="Text1" type="text" />
<img alt="" src="" id="img1" />
i want to set its tooltip or tittle in codebehind .
I tried the following code but its not working
Button1.Attributes["tittle"] = "i am button";
Text1.Attributes["tittle"] = "i am text";
img1.Attributes["tittle"] = "i am image";
this is not working please help
Set runat="server" for each control:
<input id="Button1" runat="server" type="button" value="button" />
Then in CodeBehind in Page_Load use this:
Button1.Attributes.Add("title", "i am button");
You need to mark those elements as runat="server" so that the server knows about them. Otherwise, server-side code won't be aware that they exist.
Alternatively, you could add a blob of javascript to the response message body and have the JS set the attributes. That's silly and ugly, though.

toggle button: How to have same contents between the editors when I toggle?

I am trying to implement a toggle switch-toggle between textarea and ckeditor in my web form.
As of now I am able to toggle between the 2 editors.But I am not able to have the same contents in both the editors. Its treating it like 2 separate textarea, I want them to have the same contents when I toggle from textarea to ckeditor.Can anybody help me and lemme know what I am missing?
Thanks in advance
Code:
Updated code
<textarea id="editor1" name="editor1" class="ckeditor" rows="20" cols="75"></textarea>
<input type="button" value="CKEditor" onclick="CKEDITOR.replace('editor1');" />
<input type="button" value="Text editor" onclick="CKEDITOR.instances.editor1.destroy('editor1');" />
<input type="submit" value="Submit" />
</form>
Use CKEDITOR.instances.editor1.destroy() to restore it to a textarea and call CKEDITOR.replace('editor1') again when you want a CKEditor.
Remove the whole <div id="textarea"> because otherwise you will get unexpected results, you're using two textareas with the same id and name.

How do I retrieve HTML POST data for manipulation in ASP.NET WebForms?

I have the following html:
<html>
<body>
<form runat="server">
Name: <input type="text" name="name" />
<br />
<input type="submit" name="submit" />
</form>
</body>
</html>
How do I retrieve the value in the "name" textbox posted back to the webserver to manipulate in ASP.NET WebForms?
(I know about the ASP.NET built-in controls and the possibilities with them, but I am looking for a "clean" solution without the use of built-in ASP.NET controls)
If you can't, or don't want to use asp.net textboxes, then you can retrieve the name of a regular html textbox like this:
string nameTextPosted = Request.Form["name"];
Just note that textboxes created in this manner will not automatically persist their values across postbacks like asp.net textboxes will.
Simplest solution would be to turn it into a server-side component and access it by it's name. e.g.
<asp:TextBox Id="Name" runat="server"></asp:TextBox>
...
string name = Name.Text;
Unless you have other reasons not to use a component, you'd only be making things much more difficult on your part for no justification.
ASP.net includes Html server controls for backward compatibility for just someone like you fond of html. make your html tags server controls by adding the runat="server" and id properties and you are able to access them inside your server side code with their id.
<form runat="server">
Name: <input type="text" name="name" id="name" runat="server" />
<br />
<input type="submit" name="submit" id="name1" runat="server" />
</form>
Now after this you can control their behavior:
name.Value="Hellow World !"
You have to add id and runat="server" in each control. like this :
<input type="text" name="name" id="name" runat="server" />
Its better to use asp:TextBox like this :
<asp:TextBox ID="name" runat="server"></asp:TextBox>

Resources