Why this javascript is not working in rails? - javascript

When I am clicking back button from browser it is showing the outdated value from database. I tried to use following code but it's not working
<script type="text/javascript">
$(document).ready(function() {
alert("I am an alert box!");
});
</script>
How to refresh the page or get updated value when users click on back button of browser?

Asp.Net Webforms:
In Page Load (or) if you want all pages then put on Master Page Load
Response.Cache.SetExpires(DateTime.UtcNow.AddMinutes(-1));
Response.Cache.SetCacheability(HttpCacheability.NoCache);
Response.Cache.SetNoStore();
Asp.Net MVC:
Add this attribute in Action or Controller
[OutputCacheAttribute(VaryByParam = "*", Duration = 0, NoStore = true)]
Or
If you want disable cache for all views then add the below in Filter Config
filters.Add(new OutputCacheAttribute{VaryByParam = "*",Duration = 0,NoStore = true});
Edit: I noticed, in comment you mentioned you are using ruby on rail. I am not familiar with that, but the logic is server need to send an header to the browser for "do not cache that page". So you can find some answers here Ruby on Rails: Clear a cached page

Use a hash to determine if it has already been refreshed, to ensure it happens just once:
window.onload = function() {
if(!window.location.hash) {
window.location = window.location + '#loaded';
window.location.reload();
}
}

There is no problem with the integration of jquery and the code. Rails project comes with TurboLink which have some conflicts with jquery. One of the possible solution is to remove turbolink from the project (remove it from application.rb) and use Jquery-Turbolink.
This will allow to use jquery inbuilt functions like I had in my question.
Please update the answer or add comment for other possible solutions.

Related

Fire a Javascript function after submitting a Gravity Form

I have a multi-page form where the url remains the same when moving between pages.
I am trying to change some HTML after the submit button has been clicked.
I can run this in the console and the result is as I want it.
How can I get this run after submit?
I've tried window.onload and document.onload functions but they are not working. I've also tried an onclick function but it seems moving to the next page stops this working?
var confirm = document.getElementById('gform_confirmation_message_14');
if(confirm) {
document.getElementsByClassName("entry-title")[0].innerHTML = "PAYE Worker";
}
Thanks
Perhaps the gform_page_loaded event? From the documentation it:
Fires on multi-page forms when changing pages (i.e. going to the next or previous page).
$(document).on('gform_page_loaded', function(event, form_id, current_page) {
// do stuff
});
There are a bunch of javascript events available, and if not this one, maybe another serves your purpose, e.g. gform_post_render.
I removed the Javascript completely and created a confirmation in Gravity Forms that redirects to a new page upon submission.
Created a title for this new page "PAYE worker"
Problem solved

Alfresco 5 community: Reload document preview after executing onActionFormDialog doclib

I have written a java class similar to default SendAsEmailActionExecuter. In this class a pdf file is modified. After successful execute of the doclib action alfresco does not refresh preview and keeps the old one until refresh the entire page. How can I tell to alfresco reload the document preview without the need to push F5?
I think if you simple want to refresh page using javascript there are number of ways to do that
window.location.reload(true);
or
window.location.reload();
or
location.href = location.href;
If you want to update metadata, There is a out of box api "metadatarefresh" of alfresco which you can use.Two ways to use that
Option 1:
In side your ajax call
this.modules.actions.genericAction(
{
success:
{
event:
{
name: "metadataRefresh"
},
.....
Option 2: Use it via bubbling
YAHOO.Bubbling.fire("metadataRefresh");
Hope this helps.

Dynamic Follow Up Page with Marketo Forms

We are using a script that allows us to to change the follow up URLS of a form dynamically so we can use the same form across multiple assets but have different follow up pages.
The issue is that script only works when it loads the form itself rather than bringing it in via the visual editor. If we adjust the code as per the instructions on the developer site to make it work with the visual editor, it stops working.
We need to bring the form in via the editor because we have another script that only works on forms that are loaded in that manner. This script opens the follow up page in the parent window rather than the iframe.
Can you provide any suggestions?
Here's the code for the script:
Dynamic follow up URL:
<script type="text/javascript">// <![CDATA[
MktoForms2.whenReady(function(form){
//Add an onSuccess handler
form.onSuccess(function(values, followUpUrl){
//Take the lead to a different page on successful submit, ignoring the form's configured followUpUrl.
location.href = "http://solutions.healthcaresource.com/2346-staff-assessment-thank-you.html";
//return false to prevent the submission handler continuing with its own processing
return false;
});
});// ]]>
Use document.getElementById('iframe_id').src (given an iframe with an id of 'iframe_id'):
location.href = "http://solutions.healthcaresource.com/2346-staff-assessment-thank-you.html";
To this
document.getElementById('iframe_id').src = "http://solutions.healthcaresource.com/2346-staff-assessment-thank-you.html";
You can add Marketo variable to be able to give dynamic followup link.
Add following meta for variable, and use it in script. Code will be like this in your landing page.
<meta class="mktoString" id="ThankyouPage" mktoName="Follow-up Page" default="Add dynamic followup page here" allowHtml="false">
<script>
MktoForms2.whenReady(function (form) {
form.onSuccess(function(values, followUpUrl) {
location.href = ${ThankyouPage};
return false;
});
});
</script>

Multiple jQuery document.read event handlers running in wrong order

I recently added a feature to our ASP.NET MVC web application. There's a page that is displayed when the user clicks on an item in a table. The page uses AJAX to display a partial view in a single div in the page's HTML. The partial view uses the Telerik Kendo UI to define and display dialogs and DropDownList controls. This is complicated in that the JavaScript imports are all on the View for the page, while the PartialView just builds the HTML to be displayed in the div.
The JavaScript I wrote on the page includes a jQuery document.ready event handler:
$(document).ready(
function () {
if ( $('#details-map').val() != '' )
$('#details-map').remove();
var urlTail = '?t=' + (new Date().getTime());
// Make the AJAX call and load the result into the details box.
$('#detailsbox').load('<%= Url.Action("Details") %>' + '/' + '<%: Model.Id %>' + urlTail, displayDetails);
}
)
This works fine when I run the application on my localhost. The problem appears when I deploy the page to our development server. In this case, there's an additional document.ready event handler that's emitted to very end of the page by the Telerik Kendo / ASP.net MVC extensions:
<script type="text/javascript">
//<![CDATA[
jQuery(document).ready(function(){
if(!jQuery.telerik) jQuery.telerik = {};
jQuery.telerik.cultureInfo=...;
});
//]]>
</script>
On this page, the $(document).ready event handler I wrote runs before the Telerik handler, and my code clearly depends on the Telerik handler running first. When mine runs first, I get a JavaScript error that says "jQuery.telerik.load is not a function'.
Since this does not happen on my localhost, how do I make sure that the second document ready event handler is run first?
Edit:
After more research, I've found that the problem is that the two scripts mentioned in my answer, which are supposed to be written to the page via the following line in the Master Page used by my page:
<%= Html.Telerik().ScriptRegistrar().Globalization(true).jQuery(false).DefaultGroup(group => group.Combined(false).Compress(false)) %>
Are not being loaded. In other words, the above line does nothing. It works on another page that uses the same Master Page, though. I've placed a breakpoint on the line and it is executing. Does anyone have any ideas?
You're either going to have to make it show up after the second one on the page OR do something I hate to suggest:
$(document).ready(function() {
function init {
/* all your code that needs to be run after telerik is loaded */
}
if ( $.telerik ) {
init();
} else {
setTimeout(function check4telerik() {
if ( $.telerik ) {
return init();
}
setTimeout(check4telerik, 0);
}, 0);
}
});
So, if $.telerik is loaded, it runs, otherwise it polls until it's set, and when it is set, it runs the code. It's not pretty, but if you don't have more control, it's probably your only option, unless $.telerik emits some kind of event that you can hook into.
After spending a few hours working on this, I finally got it to work. The problem turned out to be that two JavaScript files that are used by the Telerik DropdownList control and Window control were not being loaded.
In spelunking through the JavaScript on the page, I came across this script that was generated by Telerik:
if(!jQuery.telerik){
jQuery.ajax({
url:"/Scripts/2011.3.1306/telerik.common.min.js",
dataType:"script",
cache:false,
success:function(){
jQuery.telerik.load(["/Scripts/2011.3.1306/jquery-1.6.4.min.js","/Scripts/2011.3.1306/telerik.common.min.js","/Scripts/2011.3.1306/telerik.list.min.js"],function(){ ... });
}});}else{
jQuery.telerik.load(["/Scripts/2011.3.1306/jquery-1.6.4.min.js","/Scripts/2011.3.1306/telerik.common.min.js","/Scripts/2011.3.1306/telerik.list.min.js"],function(){ ... });
}
This script was emitted by a call to Html.Telerik.DropdownListFor() in my partial view. I'm guessing that the code to include for the two JavaScript files mentioned in the code, telerik.common.min.js and telerik.list.min.js, was not emitted since the call was on a partial view. Or I was supposed to include them all along & didn't know it (I'm very new to these controls). Oddly, everything worked when I ran it locally, so I don't get it.
In any case, I added two <script> tags to my View to include these files and everything started working. That is, I added the following tags to my page:
<script type="text/javascript" src="../../Scripts/2011.3.1306/telerik.common.min.js"></script>
<script type="text/javascript" src="../../Scripts/2011.3.1306/telerik.list.min.js"></script>
Live and learn.

Using Bookmarks with jQuery Address

I am using jQuery's Address plugin (website) to enable the back/forward buttons on my website. I would REALLY like to also have the ability for people to bookmark pages and to copy the address from the address bar and share it with friends.
Address claims it can do this, so then what am I doing wrong.
My code is
function BackButton() {
$.address.change(function(event) {
// do something depending on the event.value property, e.g.
// $('#content').load(event.value + '.xml');
});
$('a').click(function() {
$.address.value($(this).attr('href').replace(/^#/, ''));
});
}
BackButton() is then called on every AJAX pageload to ensure it works with the pages loaded by ajax.
Thanks for your help
looks like you copied directly from the example at the plugin's website. your address.change function does nothing, there are only two commented lines in there.
So I used
if ( $.address.value() !== "\/" ) {
window.location = "http://www.domainname.com/" + $.address.value()
}
to redirect the user to the correct page.
So is this correct? Or are their problems with it?
What would be the benefits of using the $.address.init function of jQuery.Address?
Also this forces them to wait until the page (&javascript) is loaded to see any content. comments?

Categories

Resources