DotNetOcean

Saturday, April 7

Auto Complete Textbox To Store Id While Displaying Name

This is my overall view of the application

Now the below Diagram shows the overall View of My Database:-

Now the below Diagram shows the Design View of My web Page Default.aspx:-

Now the below Diagram shows the Source View of My web Page Default.aspx:-

You can Copy the Source code of My web Page Default.aspx here :-

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxtoolkit" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<title>Untitled Page</title>

function GetCode(source, eventArgs) {

document.getElementById("hCode").value = eventArgs.get_value();

document.getElementById("hdnCompanyName").value = source;

}

function hCode_onclick() {

}

</script>

.style1

{

width: 100%;

}

.style2

{

width: 133px;

}

.style3

{

color: #336600;

}

.style4

{

color: #800000;

}

.style5

{

width: 133px;

color: #000099;

}

</style>

</head>

<body>

<asp:ScriptManager ID="ScriptManager1" runat="server"> <Services><asp:ServiceReference Path="CompanyServiceForAutoSuggest.asmx" /> </Services></asp:ScriptManager>

<div> <h1><span class="style4">Om Namah Shivaya(</span><span class="style3">Auto Complete Textbox To Store Id While Displaying Name</span><span class="style4">)</span></h1>

<table class="style1"><tr> <td class="style5"><strong>Shibashish Name:</strong></td><td><asp:TextBox ID="txtManufacturer" runat="server"/>

<ajaxToolkit:AutoCompleteExtender ID="AutoCompleteExtender1" runat="server" TargetControlID="txtManufacturer" ServicePath="CompanyServiceForAutoSuggest.asmx"

ServiceMethod="GetCountries" CompletionInterval="100" CompletionSetCount="20" MinimumPrefixLength="1" OnClientItemSelected="GetCode" /></td> </tr> <tr> <td class="style2">

 </td><td>  </td></tr> <tr> <td class="style2">  </td><td>  </td> </tr><tr> <td class="style5"> <strong>Hidden stored ID:</strong></td>

</form>

</body>

</html>

Now the below Diagram shows the code of Web.cofig:-

You can Copy the code of Web.cofig here and change it according to your connectionstring :-

<?xml version="1.0"?>

<configuration>

<connectionStrings>

<add name="TestConnectionString" connectionString="Data Source=SWASH-DBS\SWASHSQLINT;Initial Catalog=Test;Persist Security Info=True;User ID=ken;Password=kc@2011"

providerName="System.Data.SqlClient"/>

</connectionStrings>

<system.web>

<compilation debug="true" targetFramework="4.0"/>

</system.web>

<system.serviceModel>

<bindings/>

<client/>

</system.serviceModel>

</configuration>

Here is the web Service Code That I have used in My application

<%@ WebService Language="C#" Class="CompanyServiceForAutoSuggest" %>

using System;

using System.Web;

using System.Web.Services;

using System.Web.Services.Protocols;

using System.Collections.Generic;

using System.Data.SqlClient;

using System.Configuration;

using System.Data;

[WebService(Namespace = "http://tempuri.org/")]

[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]

// To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line.

[System.Web.Script.Services.ScriptService]

public class CompanyServiceForAutoSuggest : System.Web.Services.WebService {

[WebMethod]

public string HelloWorld() {

return "Hello World";

}

[WebMethod]

public List<string> GetCountries(string prefixText)

{

string constring = ConfigurationManager.ConnectionStrings["TestConnectionString"].ConnectionString;

SqlConnection con = new SqlConnection(constring);

if (con.State != ConnectionState.Open)

{

con.Open();

}

SqlCommand cmd = new SqlCommand("select * from TextboxAutoImpliment where Name like @Name", con);

cmd.Parameters.AddWithValue("@Name",prefixText+'%');

SqlDataAdapter da = new SqlDataAdapter(cmd);

DataTable dt = new DataTable();

da.Fill(dt);

List<string> Name = new List<string>();

if (dt.Rows.Count > 0){

for (int i = 0; i < dt.Rows.Count; i++)

{

Name.Add(AjaxControlToolkit.AutoCompleteExtender.CreateAutoCompleteItem(dt.Rows[i][1].ToString(), Convert.ToString(dt.Rows[i][0].ToString())));

}

return Name;

}

After running the application:-

Thanks

Shibashish Mohanty

Thursday, April 5

AutoComplete TextBox Fetching Name with ID From sqlserver database

This is my screenshot of Total application

My database screenshot

Overall database View

I have taken one linq to sql class as well as one wcf web services as Service1.svc

Here is the code of service1.svc.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Runtime.Serialization;
using System.ServiceModel;
using System.ServiceModel.Activation;
using System.ServiceModel.Web;
using System.Web.Script.Services;
using System.Text;
using System.Web;
using System.Data.SqlClient;
using System.Web.Services;
using System.Configuration;
using System.Data;

using System.Web.Services.Protocols;

namespace Test
{
[ServiceContract(Namespace = "")]
[AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]

public class Service1
{
// To use HTTP GET, add [WebGet] attribute. (Default ResponseFormat is WebMessageFormat.Json)
// To create an operation that returns XML,
// add [WebGet(ResponseFormat=WebMessageFormat.Xml)],
// and include the following line in the operation body:
// WebOperationContext.Current.OutgoingResponse.ContentType = "text/xml";
[OperationContract]
public void DoWork()
{
// Add your operation implementation here
return;
}

[OperationContract]
public string[] TXTSEARCH(string prefixText)
{
string[] Array1 = null;
DataClasses1DataContext d1 = new DataClasses1DataContext();
var res = (from result in d1.TextboxAutoImpliments
where result.Name.ToLower().StartsWith(prefixText.ToLower())
select result.Name).Take(10);
Array1 = res.ToArray();
return Array1;

}
}
}

Here is my source code:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TextBoxAutoComplete.aspx.cs" Inherits="Test.LINQInsert" %>

<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="asp" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

</head>

<body>

<form id="form1" runat="server">

<asp:ScriptManager runat="server"></asp:ScriptManager>

<table >

<tr>

<td >

ID</td>

<td>

<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>

</td>

</tr>

<tr>

<td>

Name</td>

<td>

<asp:TextBox ID="TextBox4" runat="server" AutoPostBack="True"

ontextchanged="TextBox4_TextChanged"></asp:TextBox>

<asp:AutoCompleteExtender ID="TextBox4_AutoCompleteExtender" runat="server"

DelimiterCharacters=""

Enabled="True" MinimumPrefixLength="1" ServicePath="Service1.svc" ServiceMethod="TXTSEARCH" TargetControlID="TextBox4"></asp:AutoCompleteExtender>

</td>

<td>

 </td>

</tr>

</table>

<p>

 </p>

<p>

 </p>

</form>

</body>

</html>

Here is my code Behind:

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Data;

using System.Data.SqlClient;

using System.Configuration;

using System.Threading;

namespace Test

{

public partial class LINQInsert : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

}

protected void TextBox4_TextChanged(object sender, EventArgs e)

{

DataClasses1DataContext d1 = new DataClasses1DataContext();

var res = (from result in d1.TextboxAutoImpliments

where result.Name.ToLower().StartsWith(TextBox4.Text.ToLower())

select new { ID = result.ID }).Take(10);

foreach (var id in res)

{

Label1.Text = id.ToString();

}

After Running It :

Thanks Shibashish mohanty

Monday, March 26

Dynamic AjaxTab Panel With Dynamic DropDownList Using Sql Server DataBase

In this article we will see that how to create dynamic tabs.

For making dynamic tabs I will use Ajax Tab Container controls. I will create tabs dynamically, will add controls to each of the tabs dynamically and after that we will read the value of each control on some button click.

Step 1: Open visual studio and create a web site.

STEP 2: Add the refrence to AjaxToolkit.

Now I Have Created One User control as AjaxTabUserControl.ascx as shown in below screenshot

Here is my AjaxTabUserControl.ascx Source Code:-

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="AjaxTabUserControl.ascx.cs" Inherits="AjaxTabUserControl" %>

<asp:ScriptManager ID="ScriptManager1" runat="server">

</asp:ScriptManager>

<div>

<asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder>

</div>

I have Taken one Sql server Database inside App_Data Folder as SwashAjaxTab.mdf and One Link To Sql Classes As DataClasses.dbml as shown in below figure:

Now I have Created Two Table As shown In Below Two Figure:-

Here Is My Code Behind Of My AjaxTabUserControl.ascx:-

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using AjaxControlToolkit;

public partial class AjaxTabUserControl : System.Web.UI.UserControl

{

AjaxControlToolkit.TabContainer DynamicTab;

protected void Page_Load(object sender, EventArgs e)

{

DataClassesDataContext dc = new DataClassesDataContext();

var x = GetTabInfo();

for (int i = 0; i < x.Count(); i++)

{

Table tb1 = new Table();

TableRow tr1 = new TableRow();

TableCell tc1 = new TableCell();

DynamicTab.Tabs[i].Controls.Add(tb1);

var y = GetNewItemInfo(x[i].TabID);

DropDownList drplist = new DropDownList();

for (int j = 0; j < y.Count(); j++)

{

drplist.DataSource = y;

drplist.DataTextField = "NewItem1";

drplist.DataBind();

}

tc1.Controls.Add(drplist);

tr1.Cells.Add(tc1);

tb1.Rows.Add(tr1);

}

PlaceHolder1.Controls.Add(DynamicTab);

}

protected void Page_Init(object sender, EventArgs e)

{

try { createTab(); }

catch { }

}

private List<TabItem> GetTabInfo()

{

using (DataClassesDataContext context = new DataClassesDataContext())

{

return (from c in context.TabItems

select c).ToList();

}

private List<NewItem> GetNewItemInfo(int Tid)

{

using (DataClassesDataContext context = new DataClassesDataContext())

{

return (from n in context.NewItems where n.TabID==Tid

select n).ToList();

}

private void createTab()

{

DynamicTab = new AjaxControlToolkit.TabContainer();

DataClassesDataContext dc = new DataClassesDataContext();

var x = GetTabInfo();

for (int i = 0; i < x.Count(); i++)

{

TabPanel TbPnlCategry = new TabPanel();

TbPnlCategry.HeaderText = x[i].TabName;

TbPnlCategry.ID = x[i].TabID.ToString();

DynamicTab.Tabs.Add(TbPnlCategry);

}

Now I have Created One Aspx Page As Default2.aspx and Use that User Control.

Here is my Source Code:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>

<%@ Register src="AjaxTabUserControl.ascx" tagname="AjaxTabUserControl" tagprefix="uc1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

</head>

<body>

<form id="form1" runat="server">

<div>

<uc1:AjaxTabUserControl ID="AjaxTabUserControl1" runat="server" />

</div>

</form>

</body>

</html>

Here I have Enter Some Data Into My table as mentioned in below screen shot:

After Running The .aspx page We got The Result As :

Thanks And Regards

Shibashish Mohanty

Create Dynamic Tabs using AJAX tab container & add controls & read them dynamically?

In this article we will see that how to create dynamic tabs.

Step 1: Open visual studio and create a web site.

STEP 2: Add the refrence to AjaxToolkit.

STEP 3: Declare Globally TabContainer.

STEP 4: Next is we need to create tabs dynamically. We can write code for making Dynamic Tabs in Page_load event also but the problem of writing this code in Pageload event is: If we are creating dynamic tabs for a Sharepoint custom Webpart than it will throw error on postback events. But it will work for normal ASPX pages. For this reason I will write it in Page_Init function.

STEP 5: After creating dynamic tabs we will add dynamic controls to it. Here I will create one asp table and then add the controls to it and after adding controls I will add this dynamically generated table to the tabs of the Tab Container control.

The reason why I am adding a table is just for formatting. You can directly add controls to the panel.

STEP 6: Here I have added one button and created one click event on it. This button click event I will use for reading the dynamically generated controls

Here I used one placeholder PC1 also. If we are creating Dynamic tabs for ASP application than no problem but if we are building it for Sharepoint than it is very helpful. If we are not using it than sometimes postback triggers are showing some ajax javascript error.

Now press F5 and see the result.

Hope this article will be a help to you!

Thanks Shibashish mohanty

Thursday, March 15

Simple Console Application For a Beginners

Here i have described a simple console application for a beginners. First open Visual Studio.Now go to File--> New Project.It will Display a Form like Below and give the name of that application and click Ok Button