I have a gridview that get binds dynamically. i have a linkbutton attached with every row that opens a modal popup window which I need to show some text which is in a hidden field in gridview.
I need to call a javascript function that sets the value of the label in the popup panel with the text of the hidden field. The problem is that the value is always blank when the popup is displayed.
Java script code is -
function SetNotesonModal(note)
{
//debugger;
var notes = document.getElementById(note.id).innerHTML;
document.getElementById('ctl00_ContentPlaceHolder1_popupLblNote').value = notes;
}
Code for calling the function is -
lnkViewNotes.Attributes.Add("OnClick", "return SetNotesonModal(" + e.Row.FindControl("lblNote").ClientID + ");");
The controls in gridview are as -
<ItemTemplate>
<asp:Label ID="lblNote" runat="server" Text='<%# Bind("notes") %>'></asp:Label>
<asp:LinkButton ID="lnkViewNotes" runat="server">View</asp:LinkButton>
<asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="lnkViewNotes" PopupControlID="Panel2" CancelControlID="popupBtnClose">
</asp:ModalPopupExtender>
</ItemTemplate>
And the panel for popup is -
<asp:Panel ID="Panel2" runat="server" ScrollBars="Auto" align="center" Style="display: none"
CssClass="modalPopup">
<table class="border" style="text-align: left; height: 100%" width="100%">
<tr align="left" style="background-color: #5D7B9D; color: White">
<th>
Notes
</th>
</tr>
<tr>
<td>
<asp:Label ID="popupLblNote" runat="server"></asp:Label>
</td>
</tr>
<tr>
<td>
<asp:Button ID="popupBtnClose" runat="server" Text="Close" />
</td>
</tr>
</table>
</asp:Panel>
The javascript function is being called perfectly and its is also setting value of the label in popup panel correctly but not sure why the popup comes blank every time.
Any kind of help is welcome.
Thanks
For every linkbutton or button that should not trigger post back You should try adding:
OnClientClick="return false;"
Also take a look at postback with jquery
Related
Here is my asp.net Repeater From within it there is a button. I want to get the value of lblFaulType in a string in code behind when i click Button1, How can I do that?I have tried many approaches but nothing working. Please give me your suggestions.
<asp:Repeater ID="RepterDetails" runat="server">
<HeaderTemplate>
<table style="border:1px solid #0000FF; width:500px" cellpadding="0">
</HeaderTemplate>
<ItemTemplate>
<tr style="background-color:#EBEFF0">
<td>
<table style="background-color:#EBEFF0;border-top:1px dotted #df5015; width:500px" >
<tr>
<td >
<strong><asp:Label ID="Label18" runat="server" Text="Fault Category: " Font-Bold="true"/></strong>
<asp:Label ID="lblFaultType" runat="server" Text='<%#Eval("Fault Type") %>' Font-Bold="true"/>
</td>
<td >
<strong><asp:Label ID="Label19" runat="server" Text="Fault Description: " Font-Bold="true"/></strong>
<asp:Label ID="Label8" runat="server" Text='<%#Eval("Fault Description") %>' Font-Bold="true"/>
</td>
</tr>
<tr>
<td >
<strong><asp:Label ID="Label2" runat="server" Text="Building: " Font-Bold="true"/></strong>
<asp:Label ID="Label9" runat="server" Text='<%#Eval("Name") %>' Font-Bold="true"/>
</td>
<td >
<strong><asp:Label ID="Label3" runat="server" Text="Floor: " Font-Bold="true"/></strong>
<asp:Label ID="Label10" runat="server" Text='<%#Eval("FloorNo") %>' Font-Bold="true"/>
</td>
</tr>
<tr>
<td>
<strong><asp:Label ID="Label6" runat="server" Text="Room Number: " Font-Bold="true"/></strong>
<asp:Label ID="Label11" runat="server" Text='<%#Eval("RoomNumber") %>' Font-Bold="true"/>
</td>
</tr>
<tr>
<td ><strong><asp:Label ID="Label14" runat="server" Text="Created Time: " Font-Bold="true"/></strong> <asp:Label ID="lblUser" runat="server" Font-Bold="true" Text='<%#Eval("Time") %>'/></td>
<td ><strong><asp:Label ID="Label15" runat="server" Text="Created Date: " Font-Bold="true"/></strong><asp:Label ID="lblDate" runat="server" Font-Bold="true" Text='<%#Eval("Date") %>'/></td>
</tr>
<tr>
<td ><strong><asp:Label ID="Label16" runat="server" Text="Start Status: " Font-Bold="true"/></strong> <asp:Label ID="Label12" runat="server" Font-Bold="true" Text='<%#Eval("StartStatus") %>'/></td>
<td ><strong><asp:Label ID="Label17" runat="server" Text="Assign Status: " Font-Bold="true"/></strong> <asp:Label ID="Label13" runat="server" Font-Bold="true" Text='<%#Eval("AssignStatus") %>'/></td>
</tr>
</table>
</td>
</tr>
<tr>
<td >
<asp:TextBox ID="lblComment" runat="server" style="color:#000000; font-weight: bold;" placeholder="Describe the fault here" Text='<%#Eval("Comment") %>' TextMode="MultiLine" Columns="70" Rows="6" Enabled="false"></asp:TextBox>
</td>
</tr>
<tr>
<td colspan="2" class="text-center"><asp:Button ID="Button1" runat="server" Text="Assing Fault" class="btn btn-success" OnClick="Button1_Click" /> </td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
We may need to see the CodeBehind for this page, and specifically the "Button1_Click" method (click event).
Now though, it appears as though you only have one of the labels with an ID of "lblFaultType" (maybe you misspelled that in your initial description. Each of the other labels all carry sequentially numbered IDs (e.g. ID="Label1", ID="Label2", ID="Label3", etc), and your ClickEvent (the Button1_Click method) will need to iterate through those items to know 'which' label you are attempting to obtain a value from.
Suggestion: It may be better to apply a ClickEvent on each of the particular labels since it will have the ID there with it (a JScript/JQuery solution).
This actually a GREAT question!
(in fact good interview question)
Why?
Because how.net works for a gridview, listview, or a repeater?
They are ALL very similar.
If one has failed to grasp the “most basic” event model in .net, then suggestions to use JavaScript, or all kinds of wild approaches will be suggested (and they would get a failing mark in answering this question).
When using data bound controls that repeat data, then you can set a special command to trigger the Itemcommand event.
The attribute setting is called “CommandName”.
There are built in commands – and the command you use is important. However, "just" setting command name to somthing of your liking is sufficient in most cases.
This will CAUSE the ItemCommand event will fire. And once that occures, then you have "itemIndex" to point to any given row in the repeater (or gridview, or listview, or form view - the list goes on!!!).
So, add this to your button:
<asp:Button ID="Button1" runat="server" Text="Assing Fault"
class="btn btn-success" OnClick="Button1_Click"
CommandName = "Select" CommandArgument = '<%#Eval("Fault Type") %>'/>
Now, the the ItemCommand event, you can do this:
Protected Sub RepterDetails_ItemCommand(source As Object, e As RepeaterCommandEventArgs) Handles Repeater1.ItemCommand
Debug.Print("item command")
Dim MyRow As RepeaterItem = e.Item
Dim h As Label = e.Item.FindControl("lblFaultType")
Debug.Print(h.Text)
End Sub
Of course, since we set the CommandArguemnt to pass the value we want, then of course you can also do this:
debug.print("Value of FaultType = " & e.CommandArgument)
So, be it a classic "data aware" control in .net? Well be it a listview, gridview, repeater, and MANY MORE, then use the built in "gift horse" features that of course expected this common need and solution.
And you can get the selected index into the repeater with this:
Debug.Print(e.Item.ItemIndex)
Thanks guys but i found the answer at https://youtu.be/Oltxy1sGIds
So i did it like this:
RepeaterItem item = (sender as Button).NamingContainer as RepeaterItem; string type = +(item.FindControl("lblFaultType") as Label).Text;
I have two Update Panels in an aspx page and one ModalPopupExtender inside each of them. The problem I am facing is that, I have set the Visible property to false in the aspx page and set it to True when it needs to be displayed. But the UpdatePanel is not showing up even though I have set Visible=True property.
aspx code:
<%--Request closed --%>
<asp:UpdatePanel ID="udpModalReqClose" runat="server" Visible="false">
<ContentTemplate>
<div style="display:none">
<asp:Button ID="btnDummyButton_ReqClose" UseSubmitBehavior="true" runat="server" Text="DummyButton" Style="display: none;" />
</div>
<asp:Panel ID="pnlCloseReq" runat="server" BackColor="White" BorderStyle="Solid" BorderColor="Black" BorderWidth="1px">
<div>
<table id="Table24" runat="server" border="0" cellpadding="4" cellspacing="10" width="400px">
<tr>
<td align="center">
<asp:Label ID="lblcloseSuccessOPR" runat="server" Font-Bold="true" ForeColor="Red" />
</td>
</tr>
<tr>
<td style="height: 5px;"></td>
</tr>
<tr>
<td align="center">
<asp:Button ID="btn_okclose" runat="server" SkinID="btnSearch" CssClass="btnSearch" OnClick="btnPOCPIRedirect_Click"
CausesValidation="false" align="center" Text="OK" Width="65px" />
</td>
</tr>
<tr>
<td style="height: 5px;"></td>
</tr>
</table>
</div>
</asp:Panel>
<cc1:ModalPopupExtender ID="mpeClosedSuccess" runat="server" PopupControlID="pnlCloseReq" TargetControlID="btnDummyButton_ReqClose"
BackgroundCssClass="modalPopup1" DropShadow="true" BehaviorID="mpe">
</cc1:ModalPopupExtender>
</ContentTemplate>
</asp:UpdatePanel>
<%--Request declined --%>
<asp:UpdatePanel ID="udpModalReqDecline" runat="server" Visible="false">
<ContentTemplate>
<div style="display:none">
<asp:Button ID="btnDummyButton_ReqDecline" UseSubmitBehavior="true" runat="server" Text="DummyButton" Style="display: none;" />
</div>
<asp:Panel ID="pnlRequestDecline" runat="server" BackColor="White" BorderStyle="Solid" BorderColor="Black" BorderWidth="1px">
<div>
<table id="Table17" runat="server" border="0" cellpadding="4" cellspacing="10" width="400px">
<tr>
<td align="center">
<asp:Label ID="lblRequestDecline" runat="server" Font-Bold="true" ForeColor="Red" />
</td>
</tr>
<tr>
<td style="height: 5px;"></td>
</tr>
<tr>
<td align="center">
<asp:Button ID="Button4" runat="server" SkinID="btnSearch" CssClass="btnSearch" OnClick="btnPOCPIRedirect_Click"
CausesValidation="false" align="center" Text="OK" Width="65px" />
</td>
</tr>
<tr>
<td style="height: 5px;"></td>
</tr>
</table>
</div>
</asp:Panel>
<cc1:ModalPopupExtender ID="mpeRequestDecline" runat="server" PopupControlID="pnlRequestDecline" TargetControlID="btnDummyButton_ReqDecline"
BackgroundCssClass="modalPopup1" DropShadow="true" BehaviorID="mpe">
</cc1:ModalPopupExtender>
</ContentTemplate>
</asp:UpdatePanel>
Link buttons which triggers the modalpopup in aspx:
<ItemTemplate>
<asp:LinkButton ID="LinkButton3" OnClick="lnkCloseReleaseHL" runat="server"
Text="Close"></asp:LinkButton>
</ItemTemplate>
<asp:TemplateColumn HeaderText="Decline">
<ItemTemplate>
<asp:LinkButton ID="lnkDeclineHLRelease" runat="server" OnClick="lnkDeclineHLRelease_Click">Decline All</asp:LinkButton>
</ItemTemplate>
Code behind:
public void lnkCloseReleaseHL(object sender, System.EventArgs e)
{
udpModalReqClose.Visible = true;
string successMsg = "Request has been closed Succesfully.";
lblcloseSuccessOPR.Text = successMsg;
mpeClosedSuccess.Show();
}
protected void lnkDeclineHLRelease_Click(object sender, EventArgs e)
{
udpModalReqDecline.Visible = true;
string successMsg = "Request has been declined.";
lblRequestDecline.Text = successMsg;
mpeRequestDecline.Show();
}
If I do not set the Visible=False property in the aspx page, one of the ModalPopup is shown on the webpage, blank with the 'OK' button I have inserted in the popup.
Also, if I have just one UpdatePanel in my aspx page, the popup works perfectly fine without setting Visible property. Once I add another UpdatePanel below it, this problem occurs(screenshot in the link), where the panel with 'OK' button is displayed on page load.
Panel appearing on page with the 'OK' button
I tried searching for every possible solutions on the web but nothing has helped me. If someone can please guide me how I can resolve this, it would be of great help. I just want to know how I can make multiple UpdatePanels work without having this issue.
I'm not sure, but you can try using
style="display:none"
instead of
Visible="false"
So, I have a form design section here, where there is a "save" button and a "slot grid" button. AsyncPostBackTrigger is implemented on Save button for update panel. My problem is that after selecting values from listbox which gets binded on page load,whenever i click "btnshowslotgrids" button, the listbox looses all selected values.what should i do to prevent it?
<asp:UpdatePanel ID="Upd" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<table style="width: 100%; margin: auto; min-height: 500px;">
<tr>
<td>
<asp:ListBox SelectionMode="Multiple" ClientIDMode="Static"
ID="lbEduType" runat="server"
CssClass="multiselect form-control" DataValueField="Id"
DataTextField="Name" multiple="multiple"></asp:ListBox>
</td>
<td>
<asp:Button ID="btnshowslotgrids" Text="Slot Grids" runat="server"
CssClass="btn btn-primary" OnClick="btnshowslotgrids_Click"/>
</td>
</tr>
</table>
<table id="tblAssSubjSave" runat="server">
<tr>
<td>
<asp:Button runat="server" ID="btnSaveAssessment" Text="Save Slot"
ValidationGroup="vgAssessments" OnClick="btnSaveAssessment_Click" />
<asp:Button runat="server" ID="btnCancelAssessment" Text="Reset"
CausesValidation="false" OnClick="btnCancelAssessment_Click" />
</td>
</tr>
</table>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnSaveAssessment" />
</Triggers>
</asp:UpdatePanel>
You should bind your listbox inside the !IsPostback event.
if (!IsPostBack)
{
//bind your listbox here
}
What happen in your case, Whenever you click on button, firstly it will call the page load event and it will re-bind your listbox source therefore your selected values will be lost.
You can store the value in a hidden field and then repopulate the listbox after the page postback.
i am trying to vertically align the table present in the panel but i cant and when i apply style properties to the table it does not work ? means there would be no effect of style property on it as my code is given below,
<asp:Panel ID="Panel1" runat="server"
style="z-index:0;left:250px;position:absolute;top:160px; height: 160px; padding:10"
BackColor="Green" Width="300px">
<div style="width: 295px; height: 155px;" align= "center">
<table style="height: 48px; width: 187px; margin-left:0px; min-height:14px; min-width:55px; vertical-align:bottom" align="center" bgcolor="green" >
<tr>
<td>
<asp:Label ID="Label2" runat="server" Text="UserName" ForeColor="White"></asp:Label>
</td>
<td>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:Label ID="Label3" runat="server" Text="Password" ForeColor="White"></asp:Label>
</td>
<td>
<asp:TextBox ID="TextBox2" textmode="Password" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:Label ID="Label4" runat="server" ForeColor="White"></asp:Label>
</td>
<td>
<asp:Button ID="Button1" runat="server" Text="Login" onclick="Button1_Click" />
</td>
</tr>
</table>
</div>
</asp:Panel>
Hopes for your suggestions
Vertical alignment of some content within parent container is always tricky if you don't know the height of the content. Solution is to have a wrapper div in between parent & content elements. Then have outer container with "display:table" and wrapper div with "display:table-cell" aligned vertically in middle. See this fiddle for the illustration: http://jsfiddle.net/myXL3/3/
For complete information on this approach, see this excellent article: http://www.jakpsatweb.cz/css/css-vertical-center-solution.html
The problem here is that you have the table within a div element. Adding vertical-align:middle to the div's style should work. This assumes that the div is always "higher" than the table (as in your code snippet).
(Also, you have margins in your table's style - they should be removed to make sure they are not interfering with the vertical alignment)
I have a set textboxes where the user enters something and I use them when they click Submit. I need to add a button that lets them add another identical set of textboxes on the fly, enter data into those and then when the submit button is pressed I need to grab the value from both sets. The amount of added sets of items can be unlimited.
What's the best way to handle something like this in ASP.NET/C#?
I've looked around and have basically only gotten that you can try to use JQuery on the front end which leaves the backend a mess or you can try to use a GridView and rebind it every time with new items which can get messy.
Any better/easier way to do this?
Thanks for the help.
Use a Repeater control for the first set of text boxes, and have it repeat for each extra listing.
Here's my comment control repeater. It's a little arcane, as it was the first control I ever made in asp.net, but it should get you going.
<asp:Repeater runat="server" ID="repeater"
onitemdatabound="repeater_ItemDataBound"
>
<HeaderTemplate>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
</HeaderTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
<ItemTemplate>
<tr id="trContents" runat="server"><td>
<table id="tableComment" runat="server"
width="100%" style="border-color:Black; border-width:1px; border-style:solid;background-color:#EEEE99">
<tr><td id="tdHeader" runat="server"
style="border-color:Black; border-width:1px; border-style:solid;padding: 5px">
<table width="100%" id="tableHeader" runat="server">
<tr>
<td>
<asp:Label ID="headerText" runat="server"
Text="<%# GetHeader((CommentRecord)Container.DataItem) %>" />
</td>
<td style="text-align:right"> <%-- OnClientClick="aspnetForm.target ='_blank';" --%>
<asp:Button ID="btnEdit" runat="server" Text="Edit"
PostBackUrl="<%$ AppSettings:TextEditor %>"
/>
<asp:Button ID="btnReply" runat="server" Text="Reply"
PostBackUrl="<%$ AppSettings:TextEditor %>"
/>
</td>
</tr>
</table>
</td></tr>
<tr><td style="border-color:Black; border-width:1px; border-style:solid;background-color:#FFFFF0;padding: 10px">
<%# ((CommentRecord)Container.DataItem).Text %>
</td></tr>
<tr><td>
<table width="100%"><tr>
<td style="text-align:left">
<asp:Button ID="btnDelete" runat="server" Text="Delete"
CausesValidation="False" />
</td>
<td style="text-align:right">
<asp:Label ID="footer" runat="server" Text="<%# GetFooter((CommentRecord)Container.DataItem) %>" />
</td>
</tr></table>
</td></tr>
</table>
<asp:PlaceHolder ID="placeHolder" runat="server" />
</td></tr>
</ItemTemplate>
</asp:Repeater>
What I usually do in these cases is have Javascript that handles the client-side dynamic creation of additional textboxes, then before I submit the values, have all the data collected into a JSON object and save the JSON string into a <asp:HiddenField> control that ASP.NET can read and parse. This isn't a perfectly clean approach, but it is the best thing I have found so far.
I would create the textboxes using jQuery (assigning them a unique id) and then get the values on the server from the Request.Form key/value collection. This would be a rather simple solution.
I would recommend going the GridView way, and bind it to a DataSource object, e.g. ObjectDataSource. Clicking the add button should add an empty row to the data source, and this empty row will automatically be drawn by the GridView. When everything works you can wrap in an UpdatePanel to achieve smooth refresh when adding rows.