We Keep Coding

Call javascript in aspx.cs with div<%# Eval("variable") %>' as parameter in aspx

I have a collapsible and expandable gridview. When i change the dropdown in my gridview the gridview collapses due to the autopostback that is caused. I need to do a autopostback since I want to populate a second dropdown based on the first dropdown. Is there a way I can expanded it after it is collapsed. I am thinking of calling the javascript but i dont now how to call it since I have little knowledge in javascript. Thank you for your help.
Here is my javascript.
function divexpandcollapse(divname) {
var div = document.getElementById(divname);
var img = document.getElementById('img' + divname);
if (div.style.display == "none") {
div.style.display = "inline";
img.src = "../images/minus.gif";
} else {
div.style.display = "none";
img.src = "../images/plus.gif";
}
}
Here is the code for my indexChanged how can I add the javascript to expand the grid.
protected void OnClosetIndexChanged(object sender, EventArgs e)
{
//Call javascript to reopen gridview
}
And here is my front end
<asp:TemplateField ItemStyle-Width="20px" >
<ItemTemplate>
<a href="JavaScript:divexpandcollapse('div<%# Eval("componente_id") %>');" >
<img id="imgdiv<%# Eval("componente_id") %>" width="9px" border="0" src="../images/plus.gif"
alt="" /></a>
<asp:ImageButton ImageUrl="~/images/select.png" runat="server" CommandName="Select" OnRowDataBound = "OnRowDataBound" Width="10px" Height="10px"/>
</ItemTemplate>
<ItemStyle Width="20px" VerticalAlign="Middle"></ItemStyle>
</asp:TemplateField>
<asp:TemplateField HeaderText="Purchase Order ID">
<ItemTemplate>
<asp:Label ID="lblPurchaseOrderID" runat="server" Text='<%#DataBinder.Eval(Container.DataItem, "componente_id") %>' ></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
<tr>
<td colspan="100%" style="background:#F5F5F5" >
<div id="div<%# Eval("componente_id") %>" style="overflow:auto; display:none; position: relative; left: 15px; overflow: auto">
<div class="header">
Cambiar la cantidad
</div>
<div class="body">
<asp:Label ID="lblType" runat="server" Text=""></asp:Label>
<br/>
<label for="validationOfTypeID">Armario:</label>
<asp:DropDownList ID="drCloset2" runat="server" Width="40%" Height="30px" AutoPostBack="True" OnSelectedIndexChanged = "OnClosetIndexChanged"></asp:DropDownList>
<br/>
<label for="validationOfTypeID">cajón:</label>
<asp:DropDownList ID = "drDrawer2" runat="server" Width="40%" Height="30px" >
</asp:DropDownList>
<br />
<asp:Label ID="lblQuantity" runat="server" Text=""></asp:Label>
<asp:DropDownList Height="30px" ID="drOperation" runat="server">
<asp:ListItem>+</asp:ListItem>
<asp:ListItem>-</asp:ListItem>
</asp:DropDownList>
<asp:TextBox width="50px" ID="txtChangeQuantity" runat="server" TextMode="Number" min="0" step="1" Value="0"></asp:TextBox>
<br/>
<asp:Button ID="btnChangeQuantity" runat="server" Text="Validar" OnClick="change_quantity_Click" />
<asp:Button ID="btnHide" runat="server" Text="Anular" AutoPostBack="True" />
</div>
<asp:DetailsView id="DetailsView1" DataKeyNames="componente_id" Runat="server" Width="300px" Font-Names="Calibri"/>
</td>
</tr>
</ItemTemplate>
</asp:TemplateField>
Here is a image of what it looks like :

How to change Formview mode with javascript

I have a formview on my web page and I want to change formview mode. But I want to change this with javascript.
Is this possible?
i have a repeater which has buttons. And i have a button outside of repeater. when i click the button where is outside, it shows formview in popup. this formview has to be insert mode. And when i click the button where is on repeater, it shows formview in popup. this formview has to be edit mode. But i cant do this c#. may be if i do this with javascript, it will works
<asp:ToolkitScriptManager ID="toolkitmanager1" runat="server"></asp:ToolkitScriptManager>
<asp:LinkButton runat="server" ID="lnkFake" />
<asp:ImageButton ID="img1" runat="server" PostBackUrl="javascript:$find('popUpBehavior').show();"/>
<asp:ModalPopupExtender BackgroundCssClass="modalBackground" ID="popUpCompanyEmployee"
runat="server" PopupControlID="panel1"
TargetControlID="lnkFake" BehaviorID="popUpBehavior" CancelControlID="btnKapat">
</asp:ModalPopupExtender>
<asp:Panel ID="panel1" runat="server" CssClass="modalPopup">
<asp:UpdatePanel ID="updatepanel1" runat="server">
<ContentTemplate>
<asp:FormView ID="fv1" runat="server" DataSourceID="SqlDataSource1" DataKeyNames="ID" DefaultMode="Insert">
<InsertItemTemplate>
<asp:Label ID="lblProductName" runat="server" Text="ProductName"></asp:Label>
<asp:TextBox ID="txtProductName" runat="server" Text='<%# Eval("ProductName") %>'></asp:TextBox>
<asp:Label ID="lblQuantity" runat="server" Text="Quantity"></asp:Label>
<asp:TextBox ID="txtQuantity" runat="server" Text='<%# Eval("Quantity") %>'></asp:TextBox>
<asp:Label ID="lblUnitPrice" runat="server" Text="UnitPrice"></asp:Label>
<asp:TextBox ID="txtUnitPrice" runat="server" Text='<%# Eval("UnitPrice") %>'></asp:TextBox>
</InsertItemTemplate>
<EditItemTemplate>
<asp:Label ID="lblProductName" runat="server" Text="ProductName"></asp:Label>
<asp:TextBox ID="txtProductName" runat="server" Text='<%# Eval("ProductName") %>'></asp:TextBox>
<asp:Label ID="lblQuantity" runat="server" Text="Quantity"></asp:Label>
<asp:TextBox ID="txtQuantity" runat="server" Text='<%# Eval("Quantity") %>'></asp:TextBox>
<asp:Label ID="lblUnitPrice" runat="server" Text="UnitPrice"></asp:Label>
<asp:TextBox ID="txtUnitPrice" runat="server" Text='<%# Eval("UnitPrice") %>'></asp:TextBox>
</EditItemTemplate>
</asp:FormView>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnKapat"/>
</Triggers>
</asp:UpdatePanel>
<asp:Button ID="btnkapat" runat="server" Text="kapat"/>
</asp:Panel>
<asp:Repeater ID="rpr1" runat="server" DataSourceID="SqlDataSource1">
<ItemTemplate>
<asp:Label ID="lblID" runat="server" Text='<%#Eval("ID") %>'></asp:Label>
<asp:Label ID="lblProductName" runat="server" Text='<%#Eval("ProductName") %>'></asp:Label>
<asp:Label ID="lblQuantity" runat="server" Text='<%#Eval("Quantity") %>'></asp:Label>
<asp:Label ID="lblUnitPrice" runat="server" Text='<%#Eval("UnitPrice") %>'></asp:Label>
<asp:ImageButton ID="imgPopup" runat="server" PostBackUrl="javascript:$find('popUpCBehavior').show();" />
</ItemTemplate>
</asp:Repeater>
<asp:SqlDataSource runat="server" ID="SqlDataSource1" ConnectionString='<%$ ConnectionStrings:NET2ConnectionString %>' SelectCommand="SELECT * FROM [ProductsRA]"></asp:SqlDataSource>

Basically, changing the mode of a FormView reflects what controls (html) are rendered to the page.
So it could not happen purely on client-side. You could use an update panel , so only an asyn post backis done and only the form view html is refreshed.
Have a look for reference Formview
Documentation for reference here
Hope it clears your doubt a bit

Maintian Scrollbar Of GridView Under <div> Asp.netnot working?

i have content page in which i am selecting value from drop down on which gridview populate i am here showing my aspx page,
<div>
<table>
<tr>
<td>
<asp:DropDownList ID="ddlConsultant" runat="server"
AutoPostBack="True"
onselectedindexchanged="ddlConsultant_SelectedIndexChanged">
</asp:DropDownList>
</td>
<td>
</td>
<td>
<asp:TextBox ID="txtActivatedOn" runat="server">
</asp:TextBox>
<a href="javascript:show_calendar('<%=txtActivatedOn.ClientID%>','<%=txtActivatedOn.Text%>');">
<img border="0" src="./Images/calendar.gif" alt="calendar" /></a>
</td>
<td>
</td>
<td>
<asp:Button ID="btnUpdateActivated" runat="server" Text="Update Date"
class="button" />
</td>
</tr>
</table>
<div id="grdWithScroll" style="OVERFLOW: auto" onscroll="SetDivPosition()">
<asp:GridView ID="gvProjects" runat="server" AutoGenerateColumns="False" Height="150px"
Width="225px" CellPadding="4" ForeColor="#333333" GridLines="None" OnRowDeleting="gvProjects_RowDeleting"
DataKeyNames="ID" ViewStateMode="Inherit">
<AlternatingRowStyle BackColor="White" ForeColor="#284775" />
<Columns>
<asp:TemplateField>
<HeaderTemplate>
<asp:CheckBox ID="chk_All" runat="server" AutoPostBack="true" OnCheckedChanged="chk_All_CheckedChanged"/>
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="chk_selector" runat="server" AutoPostBack="true" OnCheckedChanged="chk_selector_CheckedChanged" Checked='<%#bool.Parse(Eval("Proj_Flag").ToString() == "True" ? "True": "False") %>'/>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField Visible="false">
<ItemTemplate>
<asp:Label ID="lbl_ID" runat="server" Text='<%# Bind("ID") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="ProjectID" Visible="true">
<ItemTemplate>
<asp:Label ID="lblProjectID" runat="server" Text='<%# Bind("ProjectID") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<%--<asp:TemplateField HeaderText="Order #">
<ItemTemplate>
<!-- <asp:Label ID="lblOrderNumber" runat="server" Text=''></asp:Label>-->
</ItemTemplate>
</asp:TemplateField>--%>
<asp:TemplateField HeaderText="Title">
<ItemTemplate>
<a href="javascript:openPopup('DsProjectDetail.aspx?mode=1&cid=<%# Eval("ID") %>&prj=<%#Eval("Title")%>' )">
<%--<%#Eval("Title")%>--%>
<asp:Label ID="lblTitle" runat="server" Text='<%# Bind("Title") %>'></asp:Label></a>
</ItemTemplate>
<ControlStyle Width="400px" />
</asp:TemplateField>
<%-- <asp:TemplateField HeaderText="CompletionDate">
<ItemTemplate>
<asp:Label ID="lblCompletionDate" runat="server" Text='<%# Bind("CompletionDate") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>--%>
<asp:TemplateField HeaderText="ConsultantID" Visible="false">
<ItemTemplate>
<asp:Label ID="lblConsultantID" runat="server" Text='<%# Bind("CompanyID") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:CommandField DeleteImageUrl="~/Images/Delete.gif" ButtonType="Image" ShowDeleteButton="True" />
</Columns>
</asp:GridView>
</div>
<input type="hidden" id="XPos" runat="server" />
<input type="hidden" id="YPos" runat="server" />
<table>
<tr>
<td>
<asp:Button ID="btnAddProject" runat="server" CssClass="button" Text="New Project"
onclick="btnAddProject_Click" />
</td>
</tr>
</table>
</div>
Javascript i am using are,
<script type="text/javascript">
window.onload = function(){
var strCook = document.cookie;
if(strCook.indexOf("!~")!=0){
var intS = strCook.indexOf("!~");
var intE = strCook.indexOf("~!");
var strPos = strCook.substring(intS+2,intE);
document.getElementById("grdWithScroll").scrollTop = strPos;
}
}
function SetDivPosition(){
var intY = document.getElementById("grdWithScroll").scrollTop;
document.title = intY;
document.cookie = "yPos=!~" + intY + "~!";
}
</script>
<script type="text/javascript">
window.scrollBy(100, 100);
function foo() {
alert("ddd");
if (grdWithScroll != null) alert(grdWithScroll.scrollTop);
}
</script>
and at the end of the page load event i am using,
Page.ClientScript.RegisterStartupScript(GetType(), "MyKey", "SetDivPosition();", true);
i have added this line in
<%# Page Language="C#" MaintainScrollPositionOnPostback="true" ...
and also added in webconfig,
<system.web>
<pages maintainScrollPositionOnPostBack="true" >
</pages>
</system.web>
getting help from this link,
http://stackoverflow.com/questions/12092150/maintain-scroll-bar-position-of-a-div-within-a-gridview-after-a-postback
One think i wanna mention that "onscroll="SetDivPosition()" in div tag showing me warning that on scroll is not valid attribute for div tag
But after doing all this its not working for me firstly i populate gridview with dropdown when grid populate it shows check box column too in all rows that on checked save check box value in database and post back occurs if i am at bottom of grid it scroll to the top after post back
Hopes for your suggestion
Thanks

How to fire javascript function on user control blur event

I'm developing a Web user control
.ascx
<div style="position:relative;border:none;" id="divComboContainer" runat="server" >
<asp:HiddenField ID="Hidden_TextField" Value="" runat="server" />
<asp:HiddenField ID="Hidden_ValueField" Value="" runat="server" />
<asp:HiddenField ID="Hidden_Value" Value="" runat="server" />
<asp:HiddenField ID="Hidden_Row_Index" Value="" runat="server" />
<asp:HiddenField ID="hfScrollPosition" Value="" runat="server" />
<asp:TextBox ID="txtDisplay" runat="server" CssClass="tb10" ></asp:TextBox>
<asp:Panel ID="DropPanel" runat="server" CssClass="ContextMenuPanel"
Width="280px" style="display :none;visibility: hidden;padding-bottom:-1px;
margin-top:-28px;margin-left:0px;background-color:#F5F5F5;overflow:hidden;
height:auto;min-height:100px;max-height:300px;max-width:350px;" >
<div id="CombClose" style="padding-right:2px;color:#FFFFFF;text-align:right;cursor:pointer;height:35px;background-color:#507CD1;width:100%;" runat="server" >Close</div>
<br />
<div runat="server" id="listDiv" style="padding-bottom:-1px;margin-top:-28px;
margin-left:0px;background-color:#F5F5F5;overflow-Y:auto;overflow-X:hidden;
height:200px;max-height:265px;max-width:350px;" tabindex="0">
<asp:CheckBoxList ID="chkList" runat="server" CssClass="Chklist">
</asp:CheckBoxList>
</div>
</asp:Panel>
<ajaxToolkit:DropDownExtender runat="server" ID="DDE" TargetControlID="txtDisplay"
DropDownControlID="DropPanel" HighlightBorderColor="Transparent" OnClientPopup="OnClientPopup" />
</div>
In this control i need to fire some java-script on lostFocus or blur event.
Can any one guide me how can i call my script on control blur or lostFocus.

javascript runtime error not handled even with code

I have this code in my masterpage:
<script type="text/javascript">
function silentErrorHandler() { return true; }
window.onerror = silentErrorHandler;
alert("handled");
</script>
But I am still getting this error:
Error: Unable to get value of the property 'scrollLeft': object is null or undefined
How can I fully suppress these errors without having to set the disable script debugging in ie?
I would fix the error but I have spent too long looking at this issue and no one has commented on my other post:
https://stackoverflow.com/questions/7915208/jscript-runtime-error-on-callback-using-updatepanel
<%# Page Title="" Language="VB" MasterPageFile="~/WinPlan.master" AutoEventWireup="false"
CodeFile="Scheduler.aspx.vb" Inherits="Scheduler" %>
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="act" %>
<%# Register Assembly="DayPilot" Namespace="DayPilot.Web.Ui" TagPrefix="DayPilot" %>
<asp:Content ID="PageHeadContent" ContentPlaceHolderID="page_header_content" runat="Server">
<asp:ScriptManagerProxy ID="ScriptManagerProxy1" runat="server" EnableViewState="true">
</asp:ScriptManagerProxy>
<asp:UpdatePanel ID="upnlSearchBar" runat="server">
<ContentTemplate>
<div class="searchBar">
<table id="userSearchBar">
<tr>
<td align="left">
<asp:Label ID="Label1" runat="server" Text="From: " Font-Bold="true" Width="50"></asp:Label>
</td>
<td align="left">
<asp:TextBox ID="txtFromDate" runat="server" Width="80"></asp:TextBox>
<asp:ImageButton ID="imgCalendarFrom" runat="server" Width="18" ImageUrl="~/Images/SmallCalendar.gif" />
<act:CalendarExtender ID="CalendarExtenderFrom" runat="server" Format="dd/MM/yyyy"
Enabled="true" PopupButtonID="imgCalendarFrom" TargetControlID="txtFromDate">
</act:CalendarExtender>
</td>
<td align="left">
<asp:Label ID="l3" Text="" runat="server" Width="20"></asp:Label>
</td>
<td align="left">
<asp:Label ID="Label2" runat="server" Text="To: " Font-Bold="true" Width="30"></asp:Label>
</td>
<td align="left">
<asp:TextBox ID="txtToDate" runat="server" Width="80"></asp:TextBox>
<asp:ImageButton ID="imgCalendarTo" runat="server" Width="18" ImageUrl="~/Images/SmallCalendar.gif" />
<act:CalendarExtender ID="CalendarExtenderTo" runat="server" Format="dd/MM/yyyy"
Enabled="true" PopupButtonID="imgCalendarTo" TargetControlID="txtToDate">
</act:CalendarExtender>
</td>
<td align="left">
<asp:Label ID="l4" Text="" runat="server" Width="20"></asp:Label>
</td>
<td align="left">
<asp:Button ID="btnSearchSchedules" runat="server" Text="Search" Width="60px" BorderStyle="None"
Height="22px" ForeColor="White" CssClass="btn" />
</td>
<td align="left">
<asp:Label ID="L5" Text="" runat="server" Width="20"></asp:Label>
</td>
<td valign="middle">
<asp:Button ID="btnUsers" runat="server" Text="Users" Width="60px" BorderStyle="None"
Height="22px" ForeColor="White" CssClass="btn" OnClientClick="editUsers();" />
</td>
<td align="left" valign="middle">
<asp:Label ID="L6" Text="" runat="server" Width="20"></asp:Label>
</td>
<td valign="bottom">
<asp:CheckBox ID="chkBusinessHours" runat="server" Text=" Show Business Hours Only"
Height="22px" BorderColor="Transparent" Font-Bold="true" ForeColor="Black" AutoPostBack="true" />
</td>
<td width="40px">
</td>
</tr>
</table>
<table id="adminSearchBar" runat="server">
</table>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Content>
<asp:Content ID="MainContent" ContentPlaceHolderID="main_content" runat="Server">
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Always">
<ContentTemplate>
<div id="dp">
<DayPilot:DayPilotScheduler ID="DayPilotScheduler1" runat="server" CellGroupBy="Day"
DataStartField="StartDate" DataEndField="EndDate" ScrollLabelsVisible="true"
DataTextField="CustomerName" DataValueField="Workcard" DataResourceField="EmployeeCode"
CellDuration="60" CellWidth="50" ViewType="Resources" Width="100%" Heigth="100%"
RowMinHeight="30" RowHeaderWidth="150" HeigthSpec="Max" HeaderFontSize="10pt"
HeaderWidth="150px" HeaderHeight="20" EventFontSize="8pt" EventMoveHandling="CallBack"
TimeFormat="Clock12Hours" DurationBarVisible="false" BusinessBeginsHour="8" BusinessEndsHour="18"
ClientObjectName="dps" EventClickHandling="JavaScript" EventClickJavaScript="editEvent(e.value());"
OnCommand="DayPilotScheduler1_Command" EventCorners="Regular" RowMarginBottom="5"
ContextMenuID="DayPilotContextMenu" TreeIndent="15" TreeImageNoChildren="images/tree_nochildren.png"
TreeImageCollapse="images/tree_collapse.png" TreeImageExpand="images/tree_expand.png"
CssClassPrefix="scheduler_" EventBackColor="" EventFontFamily="" HourNameBackColor=""
HourFontFamily="" HourFontSize="" HeaderFontFamily="" HourBorderColor="" BackColor="#ececfe"
NonBusinessBackColor="White" CellBorderColor="Silver" OnBeforeResHeaderRender="DayPilotScheduler1_BeforeResHeaderRender"
AutoRefreshEnabled="true" AutoRefreshInterval="10" HeightSpec="Max" Height="630">
</DayPilot:DayPilotScheduler>
<DayPilot:DayPilotMenu ID="DayPilotContextMenu" runat="server" CssClassPrefix="menu_">
<DayPilot:MenuItem Action="Javascript" JavaScript="redirect()" Command="Details"
Text="View Job Creator" />
</DayPilot:DayPilotMenu>
<asp:UpdateProgress DynamicLayout="false" DisplayAfter="1" ID="UpdateProgress2" runat="server">
<ProgressTemplate>
<div class="Progress">
<img src="./images/ajax-loader.gif" />
Loading ...
</div>
</ProgressTemplate>
</asp:UpdateProgress>
<act:AlwaysVisibleControlExtender ID="AlwaysVisible" runat="server" TargetControlID="UpdateProgress2"
HorizontalSide="Center" VerticalSide="Middle" HorizontalOffset="0">
</act:AlwaysVisibleControlExtender>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Content>

From the Microsoft documentation:
The onerror event fires for run-time errors, but not for compilation errors. In addition, error dialog boxes raised by script debuggers are not suppressed by returning true. To turn off script debuggers, disable script debugging in Internet Explorer by choosing Internet Options from the Tools menu. Click the Advanced tab and select the appropriate check box(es).
On the bright side, most ordinary IE users (or users of any other browser, for that matter) don't have script debugging enabled.

Seems that the JavaScript code is generated by server side because your ASP.net code doesn't contain any JavaScript code. As a result, it's difficult to tell where goes wrong.