Navigate to Url or Url.Action in Javascript - javascript

This may have already been answered somewhere but I cannot find any information that makes sense to me.
I have a Cancel button in my cshtml that contains a href='#Url.Action("Index"). It looks like this:
Cancel
Now, if changes have been made, I need to confirm whether to leave the page or save changes before leaving.
So, I've added an event on the button click to present a popup to confirm to continue or save. Of course, leaving the button code in the cshtml file as it is, acts exactly as one would expect. It's a link and my event never fires.
I changed the cshtml button to the following code:
<input type="button" class="navigationButtons" id="btnCancel" value="Cancel" title="Return to Home Page" />
Now, my event gets fired and I display my popup to confirm continue or save.
The save works great because it's another method that performs a save to the db. I can't make the Confirm button into a link button, because it is used in another place in the code that just continues without leaving the page.
I have found answers for window.location, $.get and $.ajax. But I cannot figure out how to put into the JavaScript code that will go to my Index page.
PLEASE! Does anyone know how to do this and help me understand what I obviously do not know. :-(

Provided that your JavaScript is included in your .cshtml file, you can write Razor code inside your script:
window.location.replace('#Url.Action("Index")');
If you're having trouble with that, you could try creating a hidden link on your page and having your JavaScript trigger a click:
<a id="my-hidden-url" href="#Url.Action("Index")" hidden></a>
<script>
$('#my-hidden-url').trigger('click');
</script>

Related

one form button click for two actions

I have a web page whose principle use is to capture data in a form, and then onSubmit the page should spawn another window or tab where a program processes the form data. However, once a job is launched in its own window, I don't want to block the user from filling out a new form and submitting another job.
In other words, as soon as the new page is being loaded in the new window, I want the current window and page to reload and be immediately ready for the user to enter new data into the form.
I tried code that looked like this:
<form action="launch.php" method="post" target="newwindow">';
<fieldset>
<button onClick="window.location.reload();">Launch</button>
</fieldset>
</form>
On clicking the button the code does successfully open the launch.php program in the new window, but it does not reload the current page.
I then reviewed an answer to a similar question here: https://stackoverflow.com/a/44823571/2708519 by https://stackoverflow.com/users/6087092/isac
Upon reading sac's answer I then rewrote my code to look like this:
<form action="launch.php" method="post" onsubmit="return window.location.reload()" target="newwindow">';
<fieldset>
<button>Launch</button>
</fieldset>
</form>
On clicking the button the code again successfully opens the launch.php program in the new window, but it does not reload the current page.
I suspect it might be best to replace the form action parameter or onClick button parameter with a single call to a javascript function call that effects both actions based on that single event. Maybe that would require an ajax call for one of them? If so, can someone give me an example of what that javascript function call including ajax would look like?
What is a best practice in this case? Is there a particular event that I should be binding to? Or is it immaterial?

Jquery only works on reload after ui-sref

SETTING
I have a webpage with index.html which includes lots of scripts.
If a user clicks:
<button ui-sref="SCMCompanyWizard()">
<span>Add New Company</span>
</button>
Then I send the user to a new view.
Problem Scenario 1
At this view, I have a button that will not work because the associated jquery did not load. I get this error:
TypeError: Cannot read property 'show' of undefined
But, if the user refreshes the page it will work.
Problem Scenario 2
So, I added a script into the secondary included view at the top of the html. I added a <script>...</script> include. Now both of the index.html and the secondary html page have the script include.
This will make it work if the user goes to the page, but the button will fail if the user reloads the page.
Question
How do I make a webpage that works in both scenarios?
Note:
This question has been asked in many different contexts, such as :Why do I have to refresh my page for a javascript function to work?
But the answer data-ajax="false" doesn't work in the context of angular
UPDATE 1
Adding a ui-sref-opts="{reload: true, notify: true}" to my ui-sref button did not work.
i don't know why, this is because I thought it forces a reload right when the user clicks the link.
I paired this button option with only having the on the index page.
a. (If is not currenlty like that) put the js/jq code inside the load function to ensure the whole page was been load before call any code
$(function() {
})
b. (plan b) Move the code to the bottom of the html, to ensure -again- the page is currenlty loaded before the code is called.
c. If your code is dynamically created, be sure to "activate" it after the dynamic DOM is rendered. (invoke the "on" events after the code is rendered)
HIH,

submit button with no form filling

Hi i want a button to be shown on all my pages.
that code should be in such a way that no form filling is needed
the text on button will be "Problem? Click Here"
when click on button, it will be pressed and the person who has clicked cannot click again unless reload the page.
After the button is clicked the mail should be sent to admin with the exact link of page where button was clicked.
there should be no form to fill.
As for example facebook like button like the content meanwhile its pressed.
What should be the code for this? Any suggestion please?
Thank you
You can use an HTML button element with an onclick javascript function linked to it.
Since you don't want the button to work again until you have reloaded the page, you will need to do this through AJAX. This means you will have to send a request to the server, where, for instance, a PHP script will retrieve the page name from a GET variable and send the email to the administrator. The javascript part can keep track of the button being clicked once or not.
That should give you some pointers on where to start with your code. However, as stated in direct comments to your question, this site is not meant for asking for coding work to be done for you. Perhaps next time, try to think of a possible solution and ask for advice on your solution (improvements, coding conventions, etc)

Refresh and action button Html

I would like to add a button which enables to do an action and also refresh the current webpage. I don't understand why the following code doesn't work. In fact the action is performed but not the refresh.
<form class="form-search" action="#Url.RouteUrl("xx")" method="post">
<button type="submit" class="btn" onClick="window.location.reload();"></button>
</form>
Any advice?
That doesn't make any sense. The action is actually a request for another page. The refresh is a request for the same page. Just choose one.
If you just want to just give the user a refresh button, it's simple:
refresh
this is extremely simple, so it does come with its share of downsides, the main one being that you lose any URL parameters and fragments. If you don't use these, then it's just fine.

about html input tag

I know almost nothing about html and javascript. So pardon me if this is a silly question.
For a html input tag like this:
<input name="search1$btnSearch" id="search1_btnSearch" style="background-color: white;" type="submit" value="search"/>
What's gonna happen when this button is clicked?
I looked in all the .js files that are referenced by the page that contains this input tag, but I did not find any code that responds to it.
So how can I locate the code that responds to this button's click event?
By the way, I think the web site that contains this input tag is built with asp.net, because the pages have a .asxp extension.
Thanks.
This will likely submit a form to search something on the site.
Check the form tag in the html to see what file is referenced.
<form action="form_action.asp">
The action references the file.
It is used to submit a form created with the help of form tags and input elements.
What's gonna happen when this button is clicked?
Since it is a submit button, in the absence of any JS that overrides the normal functionality, it will submit the form.
I looked in all the .js files that are referenced by the page that contains this input tag, but I did not find any code that responds to it.
There might still be some.
So how can I locate the code that responds to this button's click event?
If it exists, it will likely show up if you turn on profiling in your JS debugger (make sure it is configured not to reset when you leave the page (which submitting the form will do)).
It submits the form it is in. This is HTML default and doesn't need Javascript.
Without being able to see the .js files associated with the code it is impossible to tell. But there are a few possibilities.
There is no JS attached and it simply submits the form to the server for processing.
There is JS attached to the input element itself, in which case you would look for code like $('#search1_btnSearch').click(function(){...
There is JS attached to the onsubmit event of the form itself, in which case you would just look for submit event handlers.
You can dig deeper into this code yourself by downloading the Firebug plugin for Firefox which allows you to easily browse and manipulate HTML, JS, CSS, and more.
Most probably (IF THERE IS ANY javascript) the JS event is binded to "search1_btnSearch". Use ctrl + f and search for "search1_btnSearch".
BTW: Why do you think that there is javascript involved ? what happens?
The standard behaviour without javascript is to submit the form, in which this submit button is embedded.
Nothing as far as I see
May be it is attached with a form that has some action defined and a method also. So that will decide about the action.

Categories