I am working on a ASP.NET/C# web application.
I am writing a Jquery script.
I would like to know what is the best way to add data to the script from an SQL database .
Here is a quick example showing what I would like to do:
Suppose I have a database like this
Name Color
------------+---------------+
Tom FF0000
Kate 00FF00
John 0000FF
In my script I want to do this:
$(function(){
$('#main').Picture({
colors: {Tom:'#FF0000', Kate:'#00FF00', John:'#0000FF'}
});
});
the colors should be red from the database and not hard-coded.
What is the best way to insert the colors in the correct place in my code? Should I do it in a literal control and inject the script from the code behind?
Another example:
$('#location').html('Here we put the text that I got from the database');
Thank you for any help
Suggested Scenario: Get you data from your SQL database normally like you used to, then fill the data into any web control of your choice (I prefer to use a HiddenField in this case) then the Hidden field will be available to your Javascript/jQuery code.
Example:
here are the steps you need to follow in order to get this problem fixed:
1- Create an asp:HiddenField control in your page with a proper ID (ex: 'hfMyData').
2- In your c# code, get your data from your database:
var mydata = // code to get the data from your Database
3- Fill the HiddenField value with your data:
hfMyData.value = mydata;
4- In your jQuery code Ready() function, use code similar to this:
var myDatabaseData = $("#hfMyData").val();
5- Now you have the data from your Database (myDatabaseData), use it as you want.
What I've done in the past (although it's a bit quick and dirty), is create a public property on the page, then call it in the jQuery using the <% %> tags. That way you can set the property in the code behind via the DB call, then pull them through as required.
Not very scalable, but worked well for the scenario I required (needed a twitter handle).
Related
I have googled and seems not to find a perfect answer. Most people make use of a gridview. This is what i'm trying to achieve. I am developing a website. I have about 50 records in my database. I want to display 7 records per paga and then provide a next and back button. i dont want to make use of a gridview because that wont be okay. I want to proper pagination technique where each data will be displayed in a div. I dont known what is used for pagination is a site like this but i want to handle my pagination like this too. Will really appreciate your suggestions and codes. A demo would be really appreciated. Help a rooky please. Please note that i don't want to use tables. Want something like that of php
You can use a Repeater control, and assign to it the data source.
After loading data you get the total count, and divide by 7 to get page count, then create each link that point to the same page with > .aspx?page=X .
On load you use the paging technique in your DB engine to get the proper page and assign to repeater as data source.
Do yourself a favor and look into jQuery Datatables. You can still use a gridview, listview, table, whatever and Datatables sits on top of it. Handles paging, sorting, filtering, search automatically. And on top of that it's free.
The learning curve isn't that steep either, you basically download the scripts, refer to them in your code, and then apply the jquery to your table/grid object.
https://datatables.net/
Following on from the comments you would want to do something like this to get the data
SELECT *
FROM YOURTABLE
ORDER BY SOMECOLUMN
OFFSET x ROWS
FETCH NEXT x ROWS ONLY
-- x represents the number of rows you want to bring back
-- I would recommend you keep that the same as each other
then you would want something in your query string
http://yoursite?Offset=10&Fetch=10
this would be whats passed back to your code behind.
Now depending on your level of competence with .Net you can get the query string in a few ways
var fetch = 0;
var offset = 0
if (string.IsNullOrEmpty(Request.QueryString["Fetch"].ToString()))
{
fetch = Convert.ToInt32(Request.QueryString["Fetch"]);
}
if (string.IsNullOrEmpty(Request.QueryString["Offset"].ToString()))
{
offset = Convert.ToInt32(Request.QueryString["Offset"]);
}
The pass these values into a stored procedure. I am going to assume you know how do this.
Once you have the data back from the stored procedure and have the details in a DataTable unless youre using EF.
Loop through the you can either use a Repeater control as suggested in an earlier answer.
then you can pass the details back to the screen and this is where things will get interesting as I cannot assume that your using MVC or WebForms. So the rest of this journey you're on your own I'm afraid.
I have an ASP.net 4.5 text box with 5 rows. When I save the below data to my table it does not take in consideration that there are line breaks.
Example:
Hello my name is Mike!
How are you?
Please can you help?
When saving this data to my table it of course save it like this below and it will be displayed like this again if I populate my website with this value.
Hello my name is Mike!How are you?Please can you help?
But I want it to be displayed with the line breaks as the way it was written in the first place.
The thing is, I do not want to make use of a custom form item because then the user will be able to copy and paste all html from another website in and I do not want that.
Any idea how this can be done without using a plugin such as below where the user will be able to copy and paste data into?
To populate your text box from the database try;
TextBox1.Text = someText.Replace("\r\n", Environment.NewLine)
For Label
Label1.Text = someText.Replace("\r\n", <br />)
Alternatively you could save the data to your database with the
someText = TextBox1.Text.Replace("\r\n", "<br />")
Although this approach may not be appropriate if the database is also used elsewhere.
I am returning SQL results. First I guess should I be using the reader or the adapter? Second I want to output the results to a table (I cant use a GridView because of other functions going on in the page). So I am wondering How would I go about building my own table and populating with Data from mySQL database. I cant find anything that tells me how to output to what I want. I find textboxes, labels, files etc. but not inline html? I am using ASP.net and C#
Thanks
Reader will be faster than adapter, you will get better performance and your life will get more complicated once you start creating your own grid using html table.
If you don't want to write a lot of code, then use adapter as you will get DataTable which you can easily loop through and build your own html table.
What you are looking for is: System.Web.UI.HtmlControls namespace.
HtmlTable
HtmlTableCell
HtmlTableCellCollection
HtmlTableRow
HtmlTableRowCollection
You can build HtmlTable and render it to page. Take a look at this example: Creating HTML Table...
Also, you may want to look at HtmlGenericControl where you can create any element you want like: new HtmlGenericControl("div");
Another option is to use a repeater control for emitting the data. Clean, easy, and you have full control of the markup generated.
Here's an example: http://www.aspcode.net/ASPNET-Repeater-control-instead-of-grid.aspx
I would like to do something like simple data binding in Windows Forms, but in Web Forms. So I would like to get data from a column NAME from table CATS (one row) and display in on website in text box (input type='text') and next I would like to click on "save" button to save this data to database doing an update.
Could you please give me a short snippet of how should I do it to work and get understanding of how does it go?
Really easy updating can come through the detailsview control: https://web.archive.org/web/20211020133929/https://www.4guysfromrolla.com/articles/050207-1.aspx
I have a TextBox entry field where the user will enter a integer value. And then there is a "Create" button, which when clicked upon must generate a Table with 2 columns :
"Name" and "Email" being the column headers.
I want each row to have a textbox in each of these columns.
All of this has to happen after the button is clicked. I have discovered that if you dynamically add a control in ASP.NET(I am using C#) then the controls are lost during postback. And I don't know how to prevent that from happening.
Can somebody please give me some ideas regarding how to go about adding rows dynamically to a table (I tried using the asp.net Server side table control but ran into the "lost-during-postback" problem - can I try with something else like a gridview ? but afaik a GV will not work without data bound to it )
Point to note is that my table has textboxes for user entry and it is not for showing data ..rather it is for accepting data from the user which will be later used to persist details to the database.
Dynamic Controls
That's involved. Here's an interesting article on the issue of dynamic controls.
I think normally if you create dynamic controls then you're responsible for recreating them on postback; however the article contains a way to use the Init event if it's copacetic with your app.
Edit:
or Regular ASP.NET Controls
You can use data bound ASP.NET controls like: DataList, Repeater, GridView, etc. (You can put text boxes and all other kinds of controls into them for repeating in each row - or "item") and bind values to it. If you need to perform some processing on the user input first, then generate an internal Array, List, Dictionary, DataTable etc. (your choice) and bind that data as a data source to the ASP.NET control of choice.
aspnetControl.DataSource = myDataTable;
aspnetControl.DataBind();
or
aspnetControl.DataSourceId = "name_of_control";
There are various ways to assign a data source.
This way you won't run into the same problems as with dynamic control creation; however there is a lot to learn to facilitate this way too.