how to call a back method from front asp.net - asp.net

I'm trying to call a method written in the back from a div in the front
front:
<div runat="server" id="headerLink" onclick="headerLinkOnClick" style="cursor: pointer;">
<header>
</header>
</div>
back:
protected void headerLinkOnClick(object sender, EventArgs e)
{
FormsAuthentication.SignOut();
Roles.DeleteCookie();
Session.Clear();
Response.Redirect("~/default.aspx");
}
I must miss something but no idea what.

You can achieve this with a hidden button
<asp:Button runat="server" id="btnPostback" style="display:none" onclick="headerLinkOnClick" />
<div onclick="document.getElementById('<%= btnPostback.ClientID %>').click()">Clickable DIV</div>

Related

asp.net update panel label text change

i have a code ,where i want to change the lable text and visible mode in code behind file.my page is .ascx page
<asp:UpdatePanel ID="upnlTrvLogin" runat="server">
<ContentTemplate>
<div id="divErrMsg" runat="server" style="padding-left: 11px;">
<asp:Label ID="lblErrMsg" runat="server" ForeColor="Red" Visible="False"
CssClass="errorIcon" meta:resourcekey="lblErrMsgResource2"></asp:Label>
<br />
</div>
<div style="display: inline; float: right; text-align: right; margin-top: 10px; margin-right: 13px;">
<asp:Button ID="lnkSubmit" runat="server" CausesValidation="False"
CssClass="font1_2em bolder inButton showHand" OnClick="lnkSubmit_Click"
Text="Sign In" UseSubmitBehavior="False" meta:resourceKey="lnkSubmitResource2" />
</div>
</ContentTemplate>
</asp:UpdatePanel>
code behind file
protected void lnkSubmit_Click(object sender, EventArgs e)
{
string User = GetUserDetail(txtUsername.Text.Trim(), txtPass.Text.Trim(),out personGuid, false);
if (string.IsNullOrEmptyUser (User )
{
lblErrMsg.Text = "Invalid email / password";
lblErrMsg.Visible = true;
return;
}
}
but in the button click event when i an try to change the Label text but is not changing . please tell why text of label is not changing.
Looking at you code, seems it is incorrect.
string.IsNullOrEmpty(User) was the correct statement, but you are using string.IsNullOrEmptyUser (User ).
Another tip, don't use variables with first letter on upper case, let it only for class.

asp.net on button click UpdateProgress shows progress bar and then ModalPopextender for errors combintaion

So I'm trying to understand how this should be properly setup. I have a Updateprogress that shows a progress bar when a button is clicked. The button is wrapped in an UpdatePanel. But if there're any error, I want to stop the processing and then pop up a modal window (I used Modalpopupextender) to show the errors. My issue is, it just shows the box (or object) but without the texts that came from the Exception. Here's my code:
<asp:UpdatePanel ID="UpdatePanel_ActionButtons" runat="server">
<ContentTemplate>
<asp:Button ID="Button1" runat="server" Text="Approve" OnClick="Proccess_Click1" OnClientClick="this.disabled = true; this.value = 'Processing';" UseSubmitBehavior="false" />
</ContentTemplate>
</asp:UpdatePanel>
The Progress Bar:
<asp:UpdateProgress ID="UpdateProgress" runat="server" AssociatedUpdatePanelID="UpdatePanel_ActionButtons">
<ProgressTemplate>
<div style="background-color:Gray; filter:alpha(opacity=80); opacity:0.80; width: 100%; top: 0px; left: 0px; position: fixed; height: 800px;"></div>
<div style=" filter:alpha(opacity=100); position: fixed;
z-index: 100001;
left: 720px;
top: 105px;">
<div style="width:50px; height:50px; padding:50px; background-color:white; border:solid 1px black;">
<img alt="progress" src="../images/ajax-waiting.gif"/>
Processing...
</div>
</div>
</ProgressTemplate>
</asp:UpdateProgress>
The error box:
<asp:LinkButton ID="btnNotInUse" runat="server" />
<ajaxtoolkit:ModalPopupExtender ID="qaError" runat="server"
TargetControlID="btnNotInUse"
PopupControlID="pnlQAError"
BackgroundCssClass="modalPopupExtender" />
<asp:Panel ID="pnlQAError" runat="server" Style="display: none" CssClass="modalPopup">
<br />
<asp:Button ID="OkBtn" runat="server" Text="Ok" OnClick="OkBtn_Click" />
</asp:Panel>
Button Click Method:
protected void Proccess_Click1(object sender, EventArgs e)
{
List<string> validationErrors;
string returnurl;
Processrecord(out validationErrors);
if (validationErrors.Count() > 0)
{
foreach (var error in validationErrors)
{
qaFeedback.InnerHtml += error;
}
qaError.Show();
return;
}
else
{
returnurl = "toanotherpage.aspx";
}
}
So if you look as to how I add the errors, it's adding it to the "qafeedback" div. And then I would force it to show up and then return. What's happening is it would pop out the button box, with the button, but it doesn't show the texts I added. It would be helpful to know as well that when I remove the progress bar or animation, the whole thing works or shows the error messages.
Thoughts?

Images not enlarging on click in asp.net

In my page I have a large image and set of small unit images. the large image will be loaded on page load. but when i click on small images it will get enlarge and get displayed in place of large image. the small images are displaying on page . but it has no effect on clicking them
here is my code
<div class="invDetailImage">
<img id="imgenlarge" src="" runat="server" alt="" align="middle" style="max-height:380px; max-width:579px; vertical-align:middle;"/>
<asp:Label runat="server" ID="lblerr" Visible="false" style="max-height:380px; max-width:579px; vertical-align:middle;font-size:large;"></asp:Label>
</div>
<!-- SMALL IMAGES -->
<div class="invDetailPhotoBox" runat="server" id="photobox">
<asp:Label runat="server" ID="lblphotos" Text="Select a photo below to view in the window above:"></asp:Label><br />
<asp:Repeater runat="server" ID="rptrinventoryphotos" onitemdatabound="rptrinventoryphotos_ItemDataBound">
<ItemTemplate>
<img id="imgInventory" src="" runat="server" alt='<%#Eval("ImagePath")%>' style="display:none;" />
<div onclick="large('<%#Eval("ImagePath")%>')" style="float:left;clear:none; margin-left:-12px;">
<asp:Image ID="Image1" Visible="true" runat="server" />
</div>
</ItemTemplate>
</asp:Repeater>
</div>
<script type="text/javascript"> function large(src) {
var str=src; document.getElementById("ctl00_ContentPlaceHolder1_imgenlarge").src = (str);
}
function loading(img) { img.src = "images/loading.gif"; }
</script>
protected void rptrinventoryphotos_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
HtmlImage img1 =(HtmlImage) e.Item.FindControl("imgInventory");
Image img = (Image)e.Item.FindControl("Image1");
img.ImageUrl = "http://localhost:22525/DWLive/ImageResizeHandler.ashx?imgPath=" + img1.Alt + "&width=75&height=56";
img.Style.Add("margin-left", "-12px");
img.Style.Add("background-image", "url('images/loading9.gif')");
img.Style.Add("background-repeat", "no-repeat");
img.Style.Add("background-position", "center left");
//img.Attributes.Add("onclick", "large('" + img1.Alt + "')");
string[] a = img1.Alt.Split((#"/").ToCharArray());
}
can anyone help please? thanks.
The problem was in JavaScript. I changed it to:
<script type="text/javascript">
function large(link) {
var str = link;
}
document.getElementById("ctl00_ContentPlaceHolder1_imgenlarge").src = (str);

How to use different style for the first item in repeater?

For first item I want to use the following <div>:
<div class="six columns">
<a href="">
<img src="" />
<h3>Israeli Embassy Promotes Peace</h3>
<h4>At a time when Israel is facing threats of...</h4>
</a>
</div>
And This for rest i want to use following <div>:
<div class="six columns">
<ul>
<li><a href="">
<h3>This is the first alskdjlak s</h3>
</a></li>
<li><a href="">
<h3>asd sad asd asd asdasdasdas d</h3>
</a></li>
<li><a href="">
<h3>dsad asd asd asd asd asd asd</h3>
</a></li>
</ul>
</div>
How do i do it?
You first use one integer on the code behind, that is start with 1.
Then on repeater you check this value and you go like:
<asp:Repeater ID="Repeater1" runat="server">
<ItemTemplate>
<% if (iCounter == 1) { %>
<br />First line id: <%# GetID(Container.DataItem) %>
<% } else { %>
<br />Next lines id: <%# GetID(Container.DataItem) %>
<% }
iCounter++;
%>
</ItemTemplate>
</asp:Repeater>
and on code behind:
public int iCounter = 1;
List<int> oMainIds = new List<int>();
protected void Page_Load(object sender, EventArgs e)
{
for (int i = 0; i < 10; i++)
{
oMainIds.Add(i);
}
Repeater1.DataSource = oMainIds;
Repeater1.DataBind();
}
public int GetID(object oItem)
{
return (int)oItem;
}
Please note, for the test, here I place and 10 data lines. This example renders:
First line id: 0
Next lines id: 1
Next lines id: 2
Next lines id: 3
Next lines id: 4
Next lines id: 5
Next lines id: 6
Next lines id: 7
Next lines id: 8
Next lines id: 9
Just an update to Aristos answer, without the code-behind method to get the ID.
<asp:Repeater ID="Repeater1" runat="server">
<ItemTemplate>
<asp:Panel ID="pnlFirst" runat="server" Visible="<%# (Repeater1.DataSource as List<int>).IndexOf((int)Container.DataItem) ==0 %>">
<br />First Item
</asp:Panel>
<asp:Panel ID="pnlRest" runat="server" Visible="<%# (Repeater1.DataSource as List<int>).IndexOf((int)Container.DataItem) !=0 %>">
<br />
Item: <%# (Repeater1.DataSource as List<int>).IndexOf((int)Container.DataItem) %>
</asp:Panel>
</ItemTemplate>
</asp:Repeater>
and in code behind
List<int> oMainIds = new List<int>();
protected void Page_Load(object sender, EventArgs e)
{
for (int i = 0; i < 10; i++)
{
oMainIds.Add(i);
}
Repeater1.DataSource = oMainIds;
Repeater1.DataBind();
}
Wrap your divs in PlaceHolder controls, and set the visibility of the PlaceHolders in the OnItemCreated event of the repeater using e.Item.ItemIndex to determine if the current item is the first one or not.
Or make them server-side divs (with runat=server) and set the visibility of the divs directly in the sme way
Use CSS.
.six_columns ul li
{
/* Item style */
}
.six_columns ul li:first-child
{
/* First item style */
}
There are also methods for editing content via CSS.

change div into html server control and add an click event

I have a piece of code
<div class="class1">
<span>testing</span>
</div>
I will change this into html server control.
<div class="class1" id="div1" runat="server">
<span>testing</span>
</div>
I want to add a click event.
<div class="class1" id="div1" runat="server" onclick="Test_Click">
<span>testing</span>
</div>
On code behind, I have that event handler.
protected void Test_Click(object sernder, EventArgs e)
{
//code
}
But it is not working.. I tried by changing onclick to onserverclick. it is still not working..
Any other way?
From your post I got that you want to simple go to the server side event while clicking the Div.
You can't directly give this to a DIV, instead you can use a Hidden Button in the div and trigger the click event manually.
<script>
function clickDiv() {
if (__doPostBack) {
__doPostBack('<%=btnNew.UniqueID %>', '');
}
else {
var theForm = document.forms['aspnetForm'];
if (!theForm) {
theForm = document.aspnetForm;
}
if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
theForm.__EVENTTARGET.value = '<%=btnNew.UniqueID %>';
theForm.__EVENTARGUMENT.value = '';
theForm.submit();
}
}
}
</script>
<div class="class1" id="div1" runat="server" onclick="clickDiv()">
<span>testing</span>
<asp:Button runat="server" Style="display: none" ID="btnNew" Text="Submit" OnClick="btnNew_Click" />
</div>
In _Default.aspx.cs
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void btnNew_Click(object sender, EventArgs e)
{
result.Text += "hey, event handler! ";
}
}
You can see the jQuery Implementation over here:
JQuery UI Dialog & Asp (web forms) calling event handler

Resources