Archive for March, 2015
Solution to: The type System.IO.Packaging.Package’ is defined in an assembly that is not referenced. You must add a reference to assembly ‘WindowsBase
Posted by A2H in Trouble Shooting on March 26, 2015
Description:
In article I am going to explain the solution of a problem which you may face when you work with Open Office XML SDK and DocumentFormat.OpenXML assembly in Asp.Net. After adding the needed reference when you build the project you will get exception “The type ‘System.IO.Packaging.Package’ is defined in an assembly that is not referenced. You must add a reference to assembly ‘WindowsBase’”
Solution:
To resolve this issue you need to add the reference of WindowsBase dll reference to your solution.
How to add Jquery Files manually to your solution in Asp.Net
Introduction:
Jquery files are hosted in online CDNs like Jquery and Google CDN etc. However if you don’t want to use online CDN and you want to have a local copy of jquery files in your solution then you can follow the below steps.
Steps to add the Jquery Files to your solution
You can download the latest Jquery files from Jquery download section or from online Jquery Hosted sites and use it in your project. Personally I also prefer to do that as we have a dependency on network (internet) whenever we use the online hosted libraries.
To add JQuery files to your project you need to manually add the Jquery Js files to your solution
First add a scripts folder to your project, so that you can keep all your script files in
- Open your Projectwithin the Solution Explorer
- Right-click the Main WebProjectand Choose Add option
- You will be able to see new side window opened from that select the New Folder option
- Rename the folder name to “Scripts” to add it to your project.
Now you have a folder where you can keep all your Js scripts files.
- Right-click the Scriptsfolder and Choose Add Existing Item option
- Next step is to add the jquery files to your project
- Find and select the Jquery.min.js library by browsing to its downloaded folder location)
- Click the Ok buttonto add it to your Project.
Next step is to add the jquery ui files to your project
- Find and select the jquery-ui.min.js library by browsing to its downloaded folder location.
- Click the Ok buttonto add it to your Project.
Next step is to add the css files to your project
- Find and select the smoothness/jquery-ui.css library by browsing to its downloaded folder location)
- Click the Ok buttonto add it to your Project.
How to get the Last Row value from HTMLTable in Jquery in Asp.Net
Posted by A2H in JavaScript, JQuery on March 17, 2015
Introduction:
In this article I am going to explain how to get the last row values from HTML table using Jquery. In this example I have used the online Jquery CDN files available. If you don’t want to use the Online available cdn file then you can manually add the jquery files to your solution. I have explained the steps here in detail.
I have used the last() filter function in Jquery to get the last element in that set of DOM elements.
Complete Code
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> <script> $(document).ready(function () { //Attach click event o button $('#btnGetValue').click(function () { //Get the last row in gridview var tr = $('#DetailTable tr:last'); //Ge the firstcolumnVal var firstcolumnval = $(tr).find("td").html() alert(firstcolumnval); //Get the secondcolumn value var secondcolumnval = $(tr).find("td").find('input.Col1').val(); alert(secondcolumnval); //Get the Thirdcolumn value var Thirdcolumnval = $(tr).find("td").find('input.length').val(); alert(Thirdcolumnval); //Get the Fourthcolumn value var Fourthcolumnval = $(tr).find("td").find('input.Col3').val(); alert(Fourthcolumnval); }); }); </script> <table style="width: 40%" id="DetailTable"> <tr> <td>1 </td> <td> <input type="text" maxlength="100" class="Col1" display="Dynamic" value="4" /> </td> <td> <input type="text" maxlength="100" class="Col2" display="Dynamic" value="12" /> </td> <td> <input type="text" maxlength="100" class="Col3" display="Dynamic" value="Text Value1" /> </td> </tr> <tr> <td>2 </td> <td> <input type="text" maxlength="100" class="Col1" display="Dynamic" value="5" /> </td> <td> <input type="text" maxlength="100" class="Col2" display="Dynamic" value="6" /> </td> <td> <input type="text" maxlength="100" class="Col3" display="Dynamic" value="Text Value2" /> </td> </tr> <tr> <td>3 </td> <td> <input type="text" maxlength="100" class="Col1" display="Dynamic" value="34" /> </td> <td> <input type="text" maxlength="100" class="Col2" display="Dynamic" value="12" /> </td> <td> <input type="text" maxlength="100" class="Col3" display="Dynamic" value="Text Value3" /> </td> </tr> </table> <input id="btnGetValue" value="GetValue" type="button" />
Trouble Shooting: Asp.Net AjaxControlToolkit ReOrderList control not working in IE 11 Browser
Posted by A2H in Trouble Shooting on March 6, 2015
Introduction
In this article I am going to provide a solution for the problem where the Asp.Net AjaxControlToolkit’s ReOrderList control won’t work in IE 11 Browser.
Problem Description:
In IE11 browser AjaxControlToolkit ReOrderList’s changing the order of items (ReOrder) won’t work properly. You don’t get any error however when you try to drag there won’t be any changes to ReOrderList.
Solution:
To resolve this issue you need to set the ClientIDMode to control to AutoID and it will resolve the issue.
CSS:
<style type="text/css"> .DragHandleClass { width: 40px; height: 20px; background-color: blue; color: white; cursor: move; } .ajaxOrderedList li { list-style: none; } </style>
HTML
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"></asp:ToolkitScriptManager> <asp:ReorderList ID="ReorderList1" runat="server" OnItemReorder="ReorderList1_ItemReorder" PostBackOnReorder="true" CallbackCssStyle="callbackStyle" DragHandleAlignment="Left" ItemInsertLocation="Beginning" DataKeyField="ID" SortOrderField="Name" ClientIDMode="AutoID"> <ItemTemplate> <div class="itemArea"> <asp:Label ID="Label1" runat="server" Text='<%#Eval("Name")%>' /> <asp:Label ID="Label2" runat="server" Text='<%#Eval("Order_By") %>' /> </div> </ItemTemplate> <ReorderTemplate> <asp:Panel ID="Panel2" runat="server" CssClass="reorderCue" /> </ReorderTemplate> <DragHandleTemplate> <div class="DragHandleClass">Drag</div> </DragHandleTemplate> </asp:ReorderList>
C#:
public static DataTable dt = null; protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { //test data suppose comes from database dt = new DataTable(); dt.Columns.Add("ID"); dt.Columns.Add("Name"); dt.Columns.Add("Order_By"); dt.Rows.Add(1, "Name1", "First"); dt.Rows.Add(2, "Name2", "Second"); dt.Rows.Add(3, "Name3", "Third"); dt.Rows.Add(4, "Name4", "Fourth"); this.ReorderList1.DataSource = dt; this.ReorderList1.DataBind(); } } protected void ReorderList1_ItemReorder(object sender, AjaxControlToolkit.ReorderListItemReorderEventArgs e) { DataRow selectedRow = dt.Rows[e.OldIndex]; DataRow newRow = dt.NewRow(); newRow.ItemArray = selectedRow.ItemArray; // copy data dt.Rows.Remove(selectedRow);//delete the old row dt.Rows.InsertAt(newRow, e.NewIndex); //add new row //your code save the datatable to database this.ReorderList1.DataSource = dt; this.ReorderList1.DataBind(); }
Demo: