Call function before the href Vuejs - javascript

I'm trying to call a function on a click event before the href is invoked. I want to do this so that I can set a value to a given variable and then when I redirect to the new page I can access that variable via this.$parent.varName. This is what I'm trying to do but it won't call the function:
<a #click="openWorkflow(rec.id)" href="#/workflows">Edit</a>
Not sure what I'm doing wrong here and/or if this is the right way to achieve what I want

I'd take care of redirecting to the next page inside the openWorkflow function, then you can place it directly wherever you need it to be in the logic. If you're using vue-router, you can do this by just running router.push("#/workflows"). If you're not, you can still do the standard window.location.href = 'baseurl.com/#workflows'.

Related

Swift - execute Javascript on each page

I have a UIWebView to which I pass a HTML file to load.
The HTML file includes javascript that looks for the existence of a variable.
If it exists, it performs one action, if the variable doesn't exist, the script performs another action.
if(typeof customVar === 'undefined')
//Perform task1
else
// Perform task 2 using customVar
On the native, I use the function stringByEvaluatingJavaScriptFromString to set the variable before the page is loaded.
To do so, I'm setting the code in webViewDidStartLoad (I also tried to place it in shouldStartLoadWithRequest).
func webViewDidStartLoad(webView: UIWebView)
{
let cutVar = "test"
webView.stringByEvaluatingJavaScriptFromString("customVar = '\(cutVar)';")
}
This works well when I load a page for the first time, but only the first time.
After that, it seems that through the webViewDidStartLoad, we re-assign the variable in the current page, and then reload the page itself.
So that means, the page is reloaded without the variable to be set.
Is there a way to say I want to run the javascript bit for the next page to load?
Maybe something like a global variable always accessible?
Thank you.

call method on textbox if textbox is on a specific page

I have a method that is set dynamically to different textboxes in my form. But the problem is that i only want the method to work if i am on my view called riskscore.cshtml. It there a way? like a if(page == riskscore.cshtml){ do method} kind of code?
JavaScript typically has no way of knowing if or when a particular view file was used server-side. It only knows the results that the view rendered.
You can wrap the contents of the view in say a <div class="riskscore">, then select textboxes within those:
$('.riskscore :text')...
You also mentioned in a comment that other elements won't exist without this view. You can use them as your condition, checking whether they exist:
if ($('.other-elements').length) {
// do method
}
Replace '.other-elements' as needed.
You can test URLs in JavaScript:
if(/\/riskscore\.chtml$/.test(window.location.pathname)) {
// You're on riskscore.chtml... Do something
}
you can use window.location to get the current location. or you can use location.pathname to current path.
link here
I think it will help

PrimeFaces get the current page number on page change event

I have a primefaces datatable.
I need to know the current page number on page change event using client side API.
I am using,
<p:ajax event="page" oncomplete="myFunction(usersWidget);"/>
Inside myFunction() i have
debugger;
console.log(usersWidget.paginator.getCurrentPage());
The problem is, callbacks inside oncomplete of page event are called before the new page is set (PrimeFaces.widget.Paginator.setPage) on the paginator. I traced this with the debugger.
That being said, i would get the previous page number i was on and not the current page number, inside oncomplete callback.
If i could get a callback after the page is set after i click the page link, i would know the current page.
EDIT: Docs say that its a callback called after ajax completion and after DOM is UPDATED.
then what could be potentially wrong?
Pointers please?
Its strange , cause oncomplete being called after the page was updated...
How about calling oncomplete="myFunction();" without passing the parameter ?
You might be passing the old object (with outdated information) that way... the usersWidget is global variable anyway... ans should be present in your js file
Since it seems that client side api is not synced with the right values
As a workaround you could try to pass the page value from server like this
DataTable dataTable = (DataTable)
FacesContext
.getCurrentInstance()
.getViewRoot()
.findComponent("someOformID:someTableId");
or try, instead of the line above,
PageEvent.getPage(); //PageEvent is an argument to you listener
myPageHolder = dataTable.getPage();
Than place this value to bean property and put it inside some hidden value in xhtml , than update that hidden value with p:ajax update and access it from within js

Any way to pass parameters programmatically to an onclick function?

I have an onclick function which performs several tasks. In another JavaScript function I do not have access to the context variables needed to perform these tasks. To get around this I have been simply calling the onclick function directly.
The problem I have now is that I'd like to perform a task after an Ajax action in the onclick completes. Is there any way for me to pass a function to the onclick method of a link? What would the onclick attribute look like?
e.g. something like this:
<a id="link3" href="javascript:void(0);" onclick="function(callback) { X(a); Y(b); Z(c, callback); };">click me</a>
Clicking on this would pass "undefined" as the callback, while I could also call it explicitly like this:
document.getElementById("link3").onclick(function() { alert("Completed all tasks"); } );
Is something like this possible? Basically I want to be able to pass an optional parameter to the onclick method, but if it's absent I want it to behave as if there were just procedural code in the onclick.
EDIT: Added more specifics
The use case is that the onclick calls a search function which requires session variables. When regular searches are performed there is no problem, but when I wish to refresh the search results (e.g. when a the user edits or deletes one of the returned results) I need to call the same search function that was called previously and then print out a feedback message after they are refreshed. This feedback message output is what I would like to be in the callback method. I'd also like to set the window.location.href to page down to the affected row in the event of an edit or an insert.
I have access to several variables on the server side which I print out directly to the onclick attribute when I render the page. In other JavaScript files that I am including on my page I would also like to be able to execute the same functions contained within the onclick. The only problem being that I would have to pass all these variables to those functions indirectly through several intermediate methods in the call chain.
The other option is to print these values to hidden page values and then retrieve them from within my method, but I would like to avoid this as it would be cluttering up everything just so that I could decorate my function call with some visual after-effects.
Although this may be possible somehow, I would recommend not to add arguments to the native DOM events.
I can't see a real architectural need for this, either. Can you make a full example of a use case where you need this? I'm pretty sure someone can come up with an alternative solution that doesn't make additional arguments necessary.
Wouldn't, in your example, the right place to place the alert be the success callback of the Ajax request?
This works for me:
<body onload="f = document.getElementById('link3').onclick; f(function(){alert('Completed all tasks')});">
<input id="link3" type="button" onclick="alert(typeof(arguments[0])); arguments[0]()">
</body>
The first directive returns "function", and the second one returns "Completed all tasks", as expected. In your case, the following should work:
<input id="link3" type="button" onclick="X(a); Y(b); Z(c, arguments[0]);">

Javascript and session variables

I have a database that stores events in it and a page with a calendar object on it. When rendering the days it looks through the months events and if any match the current day being rendered it creates a linkbutton to represent the event in the day on the calendar and adds it to that cell. I add some javascript to the linkbutton to change the window.location to a page to view event details passing EventID in the querystring ( I tried setting the postbackurl of the newly created linkbutton but it wasnt causing a postback... no luck). I need to set a Session variable ie. Session("EditMode") = "Edit" So the new page will know it is to get an existing event info rather than prepare to create a new event? Any SUGGESTIONS?
Your session vars are controlled by the server,
JS runs client side, and as such cannot modify the vars directly.
You need to make server requests using POST or GET and hidden
iframes, or XMLHTTPRequest() calls to send data from the JS to
the server, and then have your server side code handle the vars.
Add another query string variable that the page can use to trigger existing vs new.
Add another query string variable that the page can use to trigger existing vs new.
If you are using something like Struts2, you can have a hidden variable in your jsp
<s:hidden id="EditModeId" value="%{#session.EditMode}"/>
And within javascript simply access this variable
alert(document.getElementById('EditModeId').value);
You definitely need to add a variable to the target page. But I take it that you are doing a popup scenario, so you should be able to create a javascript function OpenWindow() and fire it off when the user clicks the link.
<script>
function OpenWindow(eventId, editMode)
{
var window = window.open("popup.aspx?eventId=" + eventId + "&editMode=" + editMode);
}
</script>
On the server side you need to build the call to the OpenWindow function. For example:
onclick="OpenWindow(eventId=" + row["eventId"].ToString() + "&editMode=" + editMode.ToString() + ");"
So in other words, prep everything on the serverside to set your javascript to post all variables to the new page. Hope this helps.
var page1 = document.getElementById("textbox").value;
sessionStorage.setItem("page1content", page1);
in other page use this value as like session variable
document.getElementById("textbox2").value=sessionStorage.getItem("page1content");

Categories