I have an aspx page with button group and label. I want to display selected button value in the paragraph tag.
Here is my controller code
$scope.GetID = function (uGuid) {
$scope.uid=uGuid;
alert($scope.uid);
}
And my aspx code is
<tr data-ng-repeat="outlet in Outlets">
<td><button data-ng-click="GetID(outlet.uGuid);">{{outlet.PartnerName}}
</button>
</td>
<p>{{uid}}</p>
The problem is that value display in the paragraph tag correctly. but it automaticaly ignored.Value Just display and reloaded.
Change controller.js
$scope.Outlets = JSON.parse(Outlets);
$scope.GetID = function (uGuid) {
$scope.Outlets = JSON.parse(Outlets);
$scope.uid = uGuid;
debugger;
alert($scope.uid);
}
The problem is that the $scope.Outlets is getting reloaded. so include
$scope.Outlets = JSON.parse(Outlets);
inside button click.
Related
I have an aspx page(running .net 4 framwork not MVC) that has an mailto that is using an href and also has a . The link button works correctly firing off code behind. If i click on the href with the mailto (it will fire up outlook with the correct info) and after that try to click on the link button, the does not fire. The looks like this when rendered.
<input type="submit" name="ctl00$ContentPlaceHolder1$btnSave" value="Save Attendance" onclick="return checkDisableButton(this.id, 'PROCESSING');" id="ContentPlaceHolder1_btnSave" class="ButtonPrimary button" disabled="">
The checkDisabledButton code
function checkDisableButton(btn, parmText, icon) {
var mbtn = $('#' + btn);
mbtn.addClass("buttonPad buttonProcessing button");
mbtn.val(parmText);};
i put a breakpoint at the var mbtn line and it doesn't hit it after the mailto link is clicked on. It does fire if i load the page and don't click on the mailto link.
Just so you have it.. the href looks like this
<a id="ContentPlaceHolder1_hlMailto" href="mailto:a#a.com;%20b#b.com;%20?Subject=2846">Load email</a>
(I edited out some info on that href so i may have messed it up on the copy)
I inspected the code of the before and after the mailto is clicked and it does not appear to have changed.
Anyway.. was wondering if anyone had any ideas...
thanks
shannon
not saying it's the perfect way.. but figured out something. i had some more code that i didn't think to include that disabled the button after it was clicked so that it wouldn't run more than once. This was the code that was having the issue with the mailto. That code looked like this
function DisableButtons() {
var inputs = document.getElementsByTagName("INPUT");
for (var i in inputs) {
if (inputs[i].type == "button" || inputs[i].type == "submit") {
inputs[i].disabled = true;
}
}
}
window.onbeforeunload = DisableButtons;
i commented out that code and added this code to the checkDisableButton function
$(mbtn).one('click', function (event) {
event.preventDefault();
//do something
$(this).prop('disabled', true);
})
this makes it so that the button can only be clicked one time. it seems to be working.
thanks
shannon
A put a ancor tag on a page. When I click it, I want the target page to appear smaller (i.e. 200px x 300px) just on top of the origin page.
Destination
After I post back, I want the Destination page to desappear.
Thanks for helping
When I click it, I want the target page to appear smaller (i.e. 200px
x 300px) just on top of the origin page
You can open it with window.open
<a onclick="openPopup();">Destination</a>
function openPopup()
{
window.open("Destination.aspx","mywindow","menubar=1,resizable=1,width=350,height=250");
}
After I post back, I want the Destination page to desappear.
Define a hidden field in Destination.aspx.
<input type="hidden" runat="server" id="hdnHidePopup" value="" />
In postback of Destination.aspx after which you want the popup to disappear, set value of hidden field to "true" or something you like
hdnHidePopup.Value = "true";
On load of popup add this javascript, could be just before the ending tag of body.
<script type="text/javascript">
hdnHidePopup = document.getElementByID('<%= hdnHidePopup.ClientID %>');
if(hdnHidePopup .value == "true")
{
hdnHidePopup.value = "";
window.close();
}
</script>
I have a left side navigation menu on my page.. using url.action like below.. I am trying to bring in a view immediately adjacent(right side of the menu) based on what link is clicked.. I put in a div next to the navigation menu.. but have no idea how to display the appropriate contents in that div...
<table>
<tr><td><a href='#Url.Action("ActionName1", "ControllerName")'>
<img src='#Url.Content("~/Content/themes/base/images/image1.png")'/></a></td></tr>
<tr><td><a href='#Url.Action("ActionName2", "ControllerName")'>
<img src='#Url.Content("~/Content/themes/base/images/image2.png")'/></a></td></tr>
</table>
<div id="DISPLAYVIEWHERE">DISPLAY VIEW HERE based on link that is clicked</div>
In controller, ActionName1 code I have this...
public ActionResult ActionName1()
{
var model = new ViewModel();
return PartialView("PartialView1", model);
}
When I run this, the partialview1 is opened in a new page. How can I get this partial view opened in the same page as the navigation menu, immediately to the right of the menu..so based on what link is clicked, partialview1 or partialview2 is displayed next to the navigation menu... thanks for your help.
you have to use ajax in that case. you can add some class to your anchor tags like
<a class='handle' href='#Url.Action("ActionName1", "ControllerName")'>
<img src='#Url.Content("~/Content/themes/base/images/image1.png")'/></a>
<a class='handle' href='#Url.Action("ActionName2", "ControllerName")'>
<img src='#Url.Content("~/Content/themes/base/images/image2.png")'/></a>
and then you can hook up the click event of these links using jquery and send an ajax call like
$('.handle').live('click', function(){
$.ajax({
url:this.href,
type='post',
success:function(data)
{
//data contains the result returned by server you can put it in div here
$('#DISPLAYVIEWHERE').html(data);
}
});
//here you have to return false to prevent anchor from taking you to other page
return false;
});
I wrote a javscript which create a popup with certain information.
function Showduplicate() {
isDuplicate = true;
var modal = document.getElementById('duplicate');
modal.style.display = '';
modal.style.position = 'fixed';
modal.style.zIndex = '100';
modal.style.left = '30%';
modal.style.top = '40%';
var screen = document.getElementById('modalScreen');
screen.style.display = '';
return false;
}
modal is a div element. duplicate is also a div element which contains certain checkboxes etc. . Now I check a query in codebehind and call this javascript function accordingly. I tried to use Page.RegisterClientScriptBlock Method but was unsuccessful. So can you guys help me out in calling the javascript function in codebehind.
I think for your scenario, you should be using Page.RegisterStartupScript(). See this post for more info on the distinction between RegisterStartupScript() and RegisterClientScriptBlock().
I'm assuming you're using Asp.Net WebForms and Asp.Net Ajax. (The same technique can be applied to other scenarios as well).
Let's say you have a button like:
<tr>
<td><input id="grid_1">Value</input></td>
<td>Add</td>
</tr>
Then you can control the popup with the following JS code:
function OnAddSuccess(result) {
// Update display
}
function OnAddError(error) {
Showduplicate();
}
function addItem(id) {
$get("LoadingLabel").innerHTML = "Loading...";
PageMethods.TryAddItem(id, $get("grid_"+id).innerHTML, OnAddSuccess, OnAddError);
}
You should not forget:
<asp:ScriptManager ID="ScriptManager" runat="server" EnablePageMethods="true" />
Label1 (asp.net control) is located inside Panel1 of my webpage and I have a button called bt. What is the Javascript to copy the Text from Label1 to the clipboard?
#artlung, I placed the below code just outside of my form but inside the body. The last line of code I placed inside Panel1 of my form. Anything wrong with this code because nothing happens when I click the Copy to Clipboard button.
<script language="JavaScript">
var clip = new ZeroClipboard.Client();
clip.addEventListener( 'mouseDown', function(client) {
// set text to copy here
clip.setText( document.getElementById('form1.Label1').value );
// alert("mouse down");
} );
clip.glue( 'd_clip_button' );
</script>
The next line of code is above the script tags but inside Panel1 in my form
<div id="d_clip_button">Copy To Clipboard</div>
I achieved this with javascript. I picked up on the fact that javascript was renaming the label from Label1 to MainContent_Label1. Then I also through debugging saw that what I wanted to grab from the variable was the innerText property. Problem Solved!
I also had the function test for an empty string and then return a confirmation alert to the user when they either copied successfully to the clipboard or when the label was empty with nothing to copy. This is all client-side.
<asp:Label ID="Label1" runat="server" Text="Copy This!!!"></asp:Label>
<script type="text/javascript">
function ClipBoardTest() {
var txt = document.getElementById('MainContent_Label1');
window.clipboardData.setData("Text", txt.innerText);
if(!txt){
alert("Nothing to Copy");
}
else {
alert("Copy to ClipBoard Successful!");
}
}
</script>
<input type="button" id='bt' onclick="ClipBoardTest();" value="Copy" />
Use the zeroclipboard library.
There is also a way to copy text from label without using any external libraries.
copyStrFunction = (copyStr) => {
const el = document.createElement('textarea'); // Create a <textarea> element
el.value = copyStr; // Set its value to the string that you want copied
el.setAttribute('readonly', ''); // Make it readonly to be tamper-proof
el.style.position = 'absolute';
el.style.left = '-9999px'; // Move outside the screen to make it invisible
document.body.appendChild(el); // Append the <textarea> element to the HTML document
el.select(); // Select the <textarea> content
document.execCommand('copy'); // Copy - only works as a result of a user action (e.g. click events)
document.body.removeChild(el); // Remove the <textarea> element
}
Call the copyStrFunction() onclick of any button and the string.
You can also modify the above function to find the label by Id and then copying the text from it.