In my page i have a
dropdown
Panel1
Panel2
Button to Move Next
onclick of dropdown data in Panel1 is displayed. and Panel 2 displays previously selected data.
When there is nothing selected indropdown Panel1 is set to invisible.
Now i want if there is nothing selected in dropdown.onclick of button an alert message to be displayed 'please select a data for panel1 and then move next'
earlier i had done this using javascript function with a custom validation function on Next button. but now i want to upgrade
it to Ajax.
Javascript Code:
function Validate(sender, args)
{
if (document.getElementById("ctl00_rightContainer_ContentTable1_Panel1").style.display == 'none') {
args.IsValid = false;
}
else {
args.IsValid = true;
}
}
But after trying ajax function i used visible property and with that i get an error in javascript saying object not found since on load Panel1 is invisible. i hav upgraded my rest functions to ajax but i dont knw hw shal i do this.
If By AJAX you means Asp.net Update Panel then it is preet easy but i dont like it.
Put the Panel inside UpdatePanels
Dont forgot to add ScriptManager on top:
<asp:ScriptManager runat="server" id="sc1"/>
<asp:UpdatePanel ID="up1" runat="server">
</asp:UpdatePanel>
And for the dropdowns set AutoPostBack to true.
The dropdown will have a selectedIndex and in selectedindex check validations and show next panel or message
You can show message like this:
In Label
OR
Alert or some jQuery Popup
ScriptManager.RegisterStartUpScript(this.Page , typeof(Page) , "alertV" , "alert('Errors');" , true);
If you set Visible property of server control to false it won't render at all and you can't show it from client-side code. Try to set style="display:none;" instead. This way panel will be rendered but not displayed on a page and you can show it from JavaScript.
Related
[enter image description here][1]Help!
I have two svg image buttons on my page. On the page load I am displaying one of the two buttons based on the value in the DB . and I have jquery to hide that button and show another one on button click from UI. I cannot show another button after hide.
both buttons are in a single span class.
The visibility property can't be block. You should use visible instead.
Have a look at the documentation for more about this property.
EDIT
If that can help... Here is an example showing both hidden and visible for the visibility attribute...
// That is executed on load.
$("#btnXX").css("visibility", "visible");
$("#btnYY").css("visibility", "hidden");
// Handler for the toggle button.
$("#toggle").on("click", function(){
$(this).toggleClass("active");
if($(this).hasClass("active")){
$("#btnXX").css("visibility", "hidden");
$("#btnYY").css("visibility", "visible");
}else{
$("#btnXX").css("visibility", "visible");
$("#btnYY").css("visibility", "hidden");
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="btnXX">XX</button><button id="btnYY">YY</button><br>
<br>
<button id="toggle">Toggle it</button>
I figured it out. My back end code was using property btnXX.Visible = false, Changing it to display:none fixed my issue.
If you don't want to render the control at all in certain situations, set Visible="false". Since it keeps the control's HTML out of the page, slightly but if you want to show the control via Ajax/etc, this won't work and display:none css should be used
I am developing a webpage in which I want to make text to get invisible after a button click and make gridview to be visible. In the page I have textboxes and button also, but those things can be made invisible by using "textbox.visible = false" and "button.visible = false" but I dont understand how to make the text to get invisible.
The design of the page is as shown below :
I want to make those "Search details", "Account number" and "Scriptname" to be invisible and only gridview to be visible after the button click ;
Please suggest how to do it.
You can include all the controls in an ASP.NET Panel control and hide\show them in code behind based on condition:-
<asp:Panel ID="SearchPanel" runat="server">
<%--put all the controls here--%>
</asp:Panel>
Then in code behind just use the panel control's id and change is visibility:-
SearchPanel.Visible = true;
SearchPanel.Visible = false;
By using panel, I was able to solve the problem.
HTML code of the page will be :
Account Number
Scriptname
Market value
In code behind page I change visibility of panel to false. (C# code is shown below)
Panel1.Visible = false;
Scenario:I have two ASPX page page1.aspx and page2.aspx.In page1.aspx there is one button named "VIEW" and in page2.aspx there is set of four buttons named "button 1","button 2","button 3" and "button 4" respectively which are defined under table tag and also there is one search text box along with search button click on page2.aspx.
My Problem statement is: When you click on "VIEW" button of page1.aspx,you should get navigate to page2.aspx and the set of four buttons which is on page2 should get invisible/disabled on page2.aspx and when i put some search word (for example Microsoft) in search text box and click on search button which is on page2.aspx,then all set of four buttons should get visible/enable along with the search results.
Issue that i am facing is, i am able to successfully navigate from page1.aspx to page2.aspx and set of four buttons which is on page2 is also getting invisible on page2.aspx.But,when i put some search criteria in search text box of page2.aspx and do the search by clicking on search button ,i am able to get search results,but my set of four buttons is not getting visible/enable on page2.aspx.I am using button.visible = "true" inside search_click() function in code behind file of page2.aspx.cs.
Wrap your buttons in an asp panel. Set the visible attribute of the panel to false in the aspx page so that it is false by default.
Make the panel visible from within the Search button click event.
for example within that event you only need the code:
Panel1.Visible= true
If you are using updatepanels then you should probably put your button panel in a separate updatepanel and set the updatemode to conditional. You should then be able to set a trigger on the updatepanel so that content refreshes only when the search button is clicked.
<asp:UpdatePanel ID="upButtons" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="false">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnSearch" />
</Triggers>
<ContentTemplate>
<<your buttons here>>
</ContentTemplate>
</asp:UpdatePanel>
I think your answer will be along these lines. You can also trigger an update directly from code with something like the following in your Search button click event.
upButtons.Update
Wing
I have a website that uses the AJAX TabContainer and has several tab panels. Each tab panel consists of a customer user control with many controls on it. I need to be able to set the active tab whenever server-side button click event is executed. How would I go about accessing the TabContainer from the custom controls C# code behind?
My markup is structured like this:
<cc1:TabContainer ID="TabRoot" runat="server" Width="100%" CssClass="ajax__tab_yuitabview-theme" onActiveTabChanged="TabRoot_ActiveTabChanged"
OnClientActiveTabChanged="SetIndex" ActiveTabIndex="0" AutoPostBack="True">
<cc1:TabPanel ID="TabPatientRoot" runat="server" HeaderText="Patient">
<ContentTemplate>
<custom:Patient ID="PatientInfo" runat="server" Visible="False"></custom:Patient>
</ContentTemplate>
</cc1:TabPanel>
</cc1:TabContainer>
It is necessary that the server side codes executes a SaveData function before the tab panel is changed because whenever the active tab changes it loads the information for the newly selected tab panel, thus losing any information that wasn't saved on the previous tab panel.
How can I accomplish executing the server side SaveData function, and then have access to TabRoot to change the active tab? Currently I was using a javascript function (in the OnClientClick for the save button) to set the active tab but it is being executed before the server-side SaveData function. This seems to be a problem for users in IE9, only.
try like this and refer this examples Ajax Control toolkit
TabRoot.ActiveTabIndex = 0; // set your active tab index to display.
Try setting ActiveIndex of tab inside your button postback event.
I have a ModalPopupExtender inside an UpdatePanel which opens an input form. The problem is when I click the "Edit" button (which is also inside the UpdatePanel) I want to fill the form with existing values using server side code. But it OnClick method of the button doesn't seem to work.
My question is: How can I make the serverside code run first, than show the edit form?
You need to show the ModalPopupExtender from server side.
First, link the ModalPopupExtender's TargetControlID to a dummy hiddenfield or a button with style="display:none" instead of the "Edit" button. I know it's sound stupid, but it's a know workaround.
Then make sure the asp.net the "Edit" button is set as a asyncpostbacktrigger if children as trigger is set to false.
Also set CausesValidation="false" to avoid the postback to be blocked by unrelated validators on the page.
Finally, At the end of "Edit" button's click event, call ModalPopupExtender.Show() to display the pop up.