Currently I have an aspx page that contains a dropdown list and four buttons.
Based on the selection made in the dropdown list then a combination of the buttons are displayed.
I currently have this implemented so that when the user makes a selection I am using AutoPostBack and the selectedChanged server side event to determine which buttons to display and then set the Visible property of these buttons in this method.
Due to the fact that this posts back I don't think its a nice solution as the whole page is posting back. I would prefer to do this using JSON.
I made the following attempt but it doesn't seem to work:
$(document).ready(function () {
jQuery("#<%= MyDropdownList.ClientID %>").change(function () {
updateAvailableButtons(jQuery(this).val());
});
});
function updateAvailableButtons(selectedItemId) {
jQuery("h2").html("selectedItemId:" + selectedItemId);
jQuery.getJSON("MyPage.aspx/GetAvailableButtons?" + Id, function (data, textStatus) { debugger; });
}
Server side:
protected void GetAvailableButtons(int selectedItemId)
{
//based on the id here then then I show hide certain buttons.
button1.Visible = true;
button2.Visible = false;
button3.Visible = false;
button4.Visible = false;
}
I've never worked with JSON before so apologies if this is way off.
Similar task can be done using JavaScript. The problem is that you'll need to use a html control instead of an asp.net button control so that you can manipulate form the client side.
Related
I'm using Visual Studio 2013 and LightSwitch. I figured out how to create a delete record button and it works great. The only problem I have is on my main page where all records are shown.
When the page loads, The View & Edit buttons only appear once I select a record. the Add and Delete are visible all the time. The problem is, while the delete function works, it only works when a record is selected. So, if the page loads and you click delete it errors out. I would like to hide the delete button until a record is clicked on. By default the Edit and View buttons that Lightswitch creates do this, however since you have to write your own Delete function I have not figured out how to do this.
Here is an example of the C# i'm working with which works fine provided a record is selected..
myapp.BrowseGiftRegistries.DeleteRegistry_execute = function (screen) {
screen.GiftRegistries.deleteSelected();
return myapp.commitChanges().then(null, function fail(e) {
myapp.cancelChanges();
throw e;
});
};
In the delete button's _canExecute() method just put the following code:
myapp.MyScreen.DeleteButton_canExecute = function (screen) {
return screen.GiftRegistries.selectedItem != null;
};
You can also control whether the button is visible when disabled by checking or unchecking the "Hidden if disabled" checkbox in the properties for the selected button.
You should do it on client side using javascript(it seems that you have provided javascript code).
For example, if you have delete button named 'DeleteRegistry':
Add code below to your BrowseGiftRegistries.lsml.js
myapp.BrowseGiftRegistries.created = function (screen) {
screen.findContentItem('DeleteRegistry').isEnabled = false;
//screen.findContentItem('DeleteRegistry').isVisible = false;
};
// Function created by clicking List( Gift Registries)->properties window->
// ->Actions->Item tap->None->edit execute code
myapp.BrowseGiftRegistries.GiftRegistry_ItemTap_execute = function (screen) {
screen.findContentItem('DeleteRegistry').isEnabled = true;
//screen.findContentItem('DeleteRegistry').isVisible = true;
};
// Modification of your function
myapp.BrowseGiftRegistries.DeleteRegistry_execute = function (screen) {
screen.GiftRegistries.deleteSelected();
screen.findContentItem('DeleteRegistry').isEnabled = false;
//screen.findContentItem('DeleteRegistry').isVisible = false;
return myapp.commitChanges().then(null, function fail(e) {
myapp.cancelChanges();
throw e;
});
};
You can replace line containing isEnabled field with commented line containing isVisible field to reach result you need.
I am working with an ASP.NET site with a C# back end. There is a .Master page where the tag is, and other search pages on the site will search when you hit enter after filling out the form. However we have one page that has a few text boxes and when you hit enter to search, it appears to just refresh and reload the page without searching. In order to search you have to hit the search button (which is an igtxt:WebImageButton ). All of the solutions I have found to this issue so far involve people using javascript to call some kind of function on submit. As far as I know there is no javascript being called when you hit the search button, it is all in the C# code. Once again I find myself searching SO and other sites for an answer but none of the solutions seem to fit my situation. The form tag is as follows:
<form id="form1" runat="server">
The web image buttons call a btn_SearchClick function that runs the search code. But since the form is started in the .Master file I can't edit that as it would effect all other pages as well. Is there any way to have enter call the btn_SearchClick from the form without having to put it in the form tag? I'm not sure what would've changed to cause this behavior on one page and none of the others.
if (!IsPostBack)
{
TextBox1.Attributes.Add("onKeyPress",
"doClick('" + btnSearch.ClientID + "',event)");
}
<SCRIPT type=text/javascript>
function doClick(buttonName,e)
{
//the purpose of this function is to allow the enter key to
//point to the correct button to click.
var key;
if(window.event)
key = window.event.keyCode; //IE
else
key = e.which; //firefox
if (key == 13)
{
//Get the button the user wants to have clicked
var btn = document.getElementById(buttonName);
if (btn != null)
{ //If we find the button click it
btn.click();
event.keyCode = 0
}
}
}
</SCRIPT>
or u can use default button.it's work while cursor's in this box
protected void Page_Load(object sender, EventArgs e)
{
this.Form.DefaultButton = this.btnSubmit.UniqueID;
}
Add some jquery to control the Enter key behavior on your textbox. Something like this:
$(function() {
$('#<%=txtTextbox.ClientID%>').keypress(function (e) {
if (e.which == 13) {
e.preventDefault();
$('#<%=btn_SearchClick.ClientID%>').click();
}
});
});
I got stuck in a problem. I am loading elements in a datalist dynamically. and i am trying to bind click event on a column using jquery. It works fine when i use master page with it. as it follows the page life cycle and loading jquery after child page data binding. But when i use it in a normal page(without master page) it does not allow me to perform desired action. I know why is this happening, the reason is jquery is being loaded before elements binding. so jquery is not able to bind click event since it is not able to find those controls.
binding elements already have "item" class in them
here is my jquery code:
$(document).ready(function () {
$('.item').click(function () {
//do something here
});
});
code behind:
protected void Page_Load(object sender, EventArgs e)
{
using (TestEntites db = new TestEntites())
{
IEnumerable<Template> Test = from t in db.Template
where t.Customer == clsuser.CustomerID
&& t.Region == user.RegionID
select t;
dlTemplateGroups.DataSource = Test;
dlTemplateGroups.DataBind();
BindTemplates(db);
}
}
$(document).ready(function () {
$('body').on('click', '.item' ,function () {
//do something here
});
});
$('body') make it more specific based on your html
I also had the same problem once and this problem really is a pain.
Here is my solution:
Instead of binding with click create a function for example:
function reBinding()
{
$('.item').on("click",function () {
//do something here
});
}
and call this function after data binding is done. it will be good if you are using update panel.
ScriptManager.RegisterStartupScript(rptGridAlbum.GetType, "scriptname", "reBinding();", True)
I currently use a hidden input field that is assigned the value of the tab that has just been selected, via javascript, like so:
function onTabSelecting(sender, args) {
var tab = args.get_tab(); //get selected tab
document.getElementById("MainContent_hdnPreviousTab").value = tab.get_text(); //assign value to hidden field
if (tab.get_pageViewID()) { //ignore
tab.set_postBack(false);
}
}
I then use this assigned value when the page is returned to, on client-side (ajax) PageLoad() event:
<script type="text/javascript" language="javascript">
var runOnce = false;
function pageLoad() {
if (!runOnce) {
var lastTab = document.getElementById("<%= hdnPreviousTab.ClientID %>");
if (lastTab.value) {
if (tabStrip) {
var tab = tabStrip.findTabByText(lastTab.value);
if (tab) {
tab.click();
}
}
}
runOnce = true;
}
}
</script>
Currently in IE this works fine (I know right?), the value that was previously set in javascript is still there and i am able to lcoate the tab that the user left the page on. However in FF, Chrome, etc. i have no such luck. The hidden field is returned to it's empty state (value = "") regardless of utilising viewstate or not.
Very curious as to whether anyone has an alternative method that would be appropriate in this situation. Please let me know if this is unclear.
Many thanks.
You could use localstorage.
localStorage.setItem('tab', value);
I am registering java script to my Asp.net code behind file, which is working fine. Now, I have some update panels on the same page and problem is whenever there is any change in any of the update panel, this script is automatically getting called. Is there any way that I can stop this happening. I can't remove update panels from my page and this script is also a very essential part of the application. In this situation I am just calling a alert (rad alert with set time out functionality) when Save Button is clicked or an Update routine is called while I have few other buttons in update panels and whenver any of the button which is registered to the update panels clicked, the following script is called un-willingly. Anyone's help will really be appreciated.
following is my Page.ClientScript
string radalertscript = "<script language='javascript'> Sys.Application.add_load(function(sender, e) {var oWnd = radalert('dialogMessage', 400, 140, 'Saved');window.setTimeout(function () { oWnd.Close(); }, 3000);});</script>";
Page.ClientScript.RegisterStartupScript(this.GetType(), "radalert", radalertscript);
You can assign empty string to same key radalert to remove the script.
if(some_condition)
Page.ClientScript.RegisterStartupScript(this.GetType(), "radalert", "");
Edit: Based on comments, you can make it simple without using RegisterStartupScript
In code behind
btnSave.Attributes.Add("", "saveButtonFunction();");
In Javascript
<script language='javascript'>
Sys.Application.add_load(function(sender, e) {
if(btnSaveClicked){
var oWnd = radalert('dialogMessage', 400,140, 'Saved');
window.setTimeout(function () { oWnd.Close(); }, 3000);
btnSaveClicked = false;
}
});
btnSaveClicked = false;
function saveButtonFunction(){
btnSaveClicked = true;
};
</script>
Thank you very much for your answer Adil. I already have followed the same approach with little difference. I have taken JavaScript out from my code behind file and have registered Sys.Application.add_load event as follow
Sys.Application.add_load(DisplayRadAlertHandler);
function DisplayRadAlertHandler() {
var getMessage = document.getElementById('<%=radAlertDialogHidden.ClientID%>').value;
if (getMessage != "") {
document.getElementById('<%=radAlertDialogHidden.ClientID%>').value = "";
var oWnd = radalert(getMessage, 400, 140, 'Saved');
window.setTimeout(function () { oWnd.Close(); }, 3000);
}
}
Here I am setting my alert message in a hidden input field from code behind file and in the above event handler I am just checking if message is there than reset the hidden field and display the message. Your approach is also right and I have marked your answer but as I am displaying my message from multiple locations (Save button, Update routine etc.) so by assigning value to hidden input field and than resetting in above event handler looks more appropriate. Thanks once again for your help.