Ajax:ModalPopup js exception, BackgroundCssClass is null - exception

I use a modal popup extender, i followed all the instructions on the toolkit sample page, except that i didn't set the property BackgroundCssClass.
this is what happens:
Is there a way I can get rude of it without setting the cssclass prop?
I don't need any styles.
If the answer is NO then please show me an example how to set it with a cssclass (even dummy).
Thanks in advance.
Here is the code:
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div>
<div style="size: 100%; vertical-align: middle">
<asp:LinkButton ID="lnkUpload" Text="Upload" ToolTip="Upload new file" runat="server" OnClick="lnkUpload_Click" />
<cc1:ModalPopupExtender ID="lnkUpload_ModalPopupExtender" runat="server" Drag="true" PopupDragHandleControlID="pnlUploadTitle" DynamicServicePath="" PopupControlID="pnlUpload" Enabled="True" TargetControlID="lnkUpload" CancelControlID="btnCancel" />
</div>
<asp:Panel ID="pnlUploadTitle" runat="server" Visible="false">
<center>
Upload file
</center>
</asp:Panel>
<asp:Panel ID="pnlUpload" runat="server" Visible="false">
<center>
<br />
<asp:FileUpload ID="upFiles" runat="server" /><br />
<br />
<asp:Button ID="btnUpload" runat="server" Text="Upload" OnClick="btnUpload_Click" />
<asp:Button ID="btnCancel" runat="server" Text="Cancel" />
<br />
</center>
</asp:Panel>
</div>
</form>

You can set the ModalPopupExtender's backgroundCssClass within the actual HTML markup.
Example from the asp.net modal popup page:
<ajaxToolkit:ModalPopupExtender ID="MPE" runat="server"
TargetControlID="LinkButton1"
PopupControlID="Panel1"
**BackgroundCssClass="modalBackground"**
DropShadow="true"
OkControlID="OkButton"
OnOkScript="onOk()"
CancelControlID="CancelButton"
PopupDragHandleControlID="Panel3" />

I spent ages looking up a solution for the similar problem
Set your PopUpControlId to be the ClientID of the control.
It solved the problem for me.
Also read more on: Codeplex

Ha-ha, I remember more then 2 years ago in AJAX beta not setting the BackgroundCssClass property caused modal popup not to be really modal, but just popup. I remember setting a style class solved the problem. I haven't used AJAX for a long time, it's funny if similar problems still persist.
Anyway, create stylesheet class inside your ASPX page or in CSS file referenced form it and set the property value to it. Maybe, this will also help.

Related

What causes the edit method activation in a gridview aspnet

I have an asp:button tag
<asp:Button runat="server" Text="Edit" CommandName="Edit" />
whenever i press it im redirected into the onrowediting event
this is my gridview:
CssClass="fl-table" AllowPaging="true" AllowSorting="true" PageSize="15" RowStyle-CssClass="GvGrid"
OnSelectedIndexChanged="OnSelectedIndexChanged"
OnSorting="gridView_Sorting"
OnPageIndexChanging="GridView_PageIndexChanging"
OnRowEditing="grdIdkun_RowEditing"
OnRowUpdating="grdIdkun_RowUpdating"
OnRowCancelingEdit="grdIdkun_RowCancelingEdit">
<PagerStyle CssClass="cssPager" />
I was wondering how my button knows its time to activate edit method when I press EDIT?
** is the attribute 'commandname' tells it directly, now ure on edit ? so its firing the onrowediting event?
I was also wondering if I could have the functionality of that line:
<asp:Button runat="server" Text="Choose" CommandName="Select"
under the input tag? such as :
<input type="button" runat="server" value="Select" """"(somecommandactivation)="Select"/>
thanks!

How to add custom inner tag in ASP.NET Web UserControl

I am creating a new Web UserControl in my ASP.NET Web Form project (using VB.NET). Normally, I could add custom attributes to my UserControl like in the solution for this question.
However, when it comes to the properties of the child controls, the name of each attribute becomes quite long as I tried to include the control name in it.
For example, I have simple user control like this:
<%# Control Language="vb" AutoEventWireup="false" CodeBehind="MyControl.ascx.vb"
Inherits="Web.MyControl" %>
<asp:Panel ID="pnl_Filter" runat="server">
<div class="d-flex row">
<div class="col-1">
<asp:Label ID="lbl_Subject" runat="server" Text="Subject" Font-Bold="true" />
</div>
<div class="col-5">
<asp:DropDownList ID="ddl_Subject" runat="server"
DataSourceID="ods_Subject"
DataTextField="subject_name"
DataValueField="subject_id">
</asp:DropDownList>
<asp:ObjectDataSource ID="ods_Subject" runat="server"
TypeName="Web.SubjectManager"
SelectMethod="GetSubjectList" />
</div>
....
</div>
</asp:Panel>
I wonder if I could create custom inner tag inside my UserControl so, when I place it in parent page, I could do something like this:
<uc:MyControl ID="mc_filter" runat="server">
<LabelProperties Text="Subject" Font-Bold="true" />
<DropdownProperties DataSourceID="ods_Subject"
DataTextField="subject_name"
DataValueField="subject_id" />
</uc:MyControl>

Logout button intercept enter key

I have asp.net page like this: There is a form that contains all, inside it a LoginStatusand some other controls like TextBox and ImageButton.
My problem is that: when we press Enter in the Text box, the LogOut button is pressed, then the user goes out. There is a way to avoid it?
I tried with javascript, but my controls are inside ajax panel and it is very complex, there is a html way?
Regards,
Antonino
Wrap the TextBox or the HTML containing the TextBox with something like this:
<div onKeyDown="return (event.keyCode!=13);"> ... </div>
If you do want something to happen when the enter key is pressed other than the LogOut button you can wrap the content inside a Panel and assign a DefaultButton like this:
<asp:Panel ID="Panel1" runat="server" DefaultButton="Button2">
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="LogOut" />
<asp:Button ID="Button2" runat="server" Text="Cancel" />
</asp:Panel>
Now when the enter key is pressed in either TextBox the Cancel button will fire.

SetFocusOnError doesn't work properly

the problem I have is that I have a form (asp.net form) and some of the fields (most of them) have RequiredFieldValidator. Now I also set SetFocusOnError="true" on all of them and it works fine for all but dropdowns. Let me define fine: after clicking on the Submit button while one of the fields is left blank, browser scrolls up to the empty field. In case of dropdowns the error message is indeed displayed properly next to the field however browser will not scroll up the screen to the field. I've read similar questions on stack overflow so far and they all come to "use JavaScript for this", but my problem is that I want to use asp.net property for this. If it's there it's supposed to work, right? Unless I do it wrong. Here comes the code for one of the working fields:
<div class ="row">
<div class="three columns medium" align="right">
<label>Email *</label>
</div>
<div class="three columns large">
<asp:TextBox ID="Email" runat="server"></asp:TextBox>
</div>
<div class="six columns large">
<asp:RequiredFieldValidator ID="EmailRequired" ControlToValidate="Email"
ErrorMessage="Please provide us your email address" forecolor="Red" SetFocusOnError="true" runat="server" /><br />
<asp:RegularExpressionValidator ID="EmailFormat" ControlToValidate="Email"
ErrorMessage="Please provide us valid e-mail address" ValidationExpression="^[^\s#]+#[^\s#]+$" forecolor="Red" runat="server" />
</div>
</div>
and here's a sample of not working focus:
<div class ="three columns medium" align="right">
<asp:DropDownList class="dropdown expand" ID="Location" runat="server">
<asp:ListItem
Enabled="True"
Text="Please choose the office location... *"
Value=""
/>
<asp:ListItem
Enabled="True"
Text="City1"
Value="City1"
/>
<asp:ListItem
Enabled="True"
Text="City2"
Value="City2"
/>
<asp:ListItem
Enabled="True"
Text="City3"
Value="City3"
/>
</asp:DropDownList>
</div>
<div class ="six columns large">
<asp:RequiredFieldValidator ID="LocationRequired" ControlToValidate="Location"
ErrorMessage="Please select the office location" forecolor="Red" SetFocusOnError="true" runat="server" />
</div>
<div class ="three columns large"></div>
Is my code wrong or am I expecting the wrong thing from it?
Set the ValidationGroup property of the each of the controls involved in this, such as the Drop Down List, Button, Required Field Validator etc as
ValidationGroup="Selection"
I afraid that 3rd party scripts like jqTransform break something in asp.net script that is setting focus on error controls. Try to remove 3rd party scripts and check. If they were cause then you need to invent something with java script

HTML markup renders not as expected

Two ASP.NET Web form pages:
Page1:
Type: Normal asp.net page, no containers or database binding controls
Rendered as: Content Content
Source (as shown in browser tool): <p>Content Content</p>
(Life is happy)
Page2:
Type: Database content, using DetailsView Control
Rendered as: Content Content
Source (as shown in browser tool): <p>Content Content</p>
I'm gonna be mad why does that happen! I want the to be a blank space!
Is that DetailsView charm or what!!
Appendix:
Page2 markup
<ItemTemplate>
<%--Title--%>
<asp:Label ID="lblTitle" runat="server" Text='<%# Eval("title") %>'></asp:Label>
<br />
<%--Date--%>
<asp:Label ID="lblDate" runat="server" Text='<%# Eval("date") %>'></asp:Label>
<br />
<%--Content--%>
<p>
<asp:Literal ID="lblContent" runat="server" Text='<%# Bind("content") %>' />
</p>
</ItemTemplate>
Note that I tried the asp:Label and asp:Literal
Not sure why you would need two-way databinding on a label, so I would probably go back to using something like the following:
<%--Content--%>
<p>
<asp:Literal ID="lblContent" runat="server" Text='<%# System.Web.HttpUtility.HtmlEncode((string)Eval("content")) %>' />
</p>