I've got a table of what I call resources, want to show in a jquery dialog a particular record when user clicks button in a row.
in the table I'm doing:
<td><%=button_to_function 'Show','showresource1()',:class =>"ui-button ui-state-default ui-corner-all", :id => resource.id %></td>
then in javascript I want to pass jQuery dialog the resource.id and open the dialog:
<script type="text/javascript" charset="utf-8">
function showresource1()
{
jQuery("#resource_details").load( 'http://localhost:3000/resources/show/4').dialog('open');
}
</script>
I can open the dialog and load this static URL, but am stumped re passing resource.id from the button_to_function down to the js function.
is button_to_function the right way to go and if so, how do I get URL defined in js?
It should be like code below
<% for res_id in ids %>
<%=button_to_function "Show", "show_resource('#{res_id}')" %>
<% end %>
<script type="text/javascript" charset="utf-8">
function show_resource(res_id)
{
jQuery("#resource_details").load( 'http://localhost:3000/resources/show/' + res_id).dialog('open');
}
</script>
Related
Having this .html snippet:
<body>
<div id="testDiv">
This always appears
</div>
<%
if(step==1)
{%>
html code
<% }
if (step==2)
{
%>
other html code
<% } %>
</body>
How can I access the variable "step", present in a .js file, imported using a script tag, in order to show HTML elements conditionally?
I am trying to somehow simulate the *ngIf function of Angular2, in AspX.
Thanks!
You can use it like this and create a javascript variable.
<script type="text/javascript">
var step = <%= step %>;
alert(step);
</script>
You can also use a ScriptManager
ScriptManager.RegisterStartupScript(Page, Page.GetType(), "setValue", "var step = " + step + ";", true);
In both cases step is available in .js files.
I am attempting to load a javascript file onto my rails application, but only for a specific page in my application, not the homepage. How would I get my javascript file to load for a specific page is using rails.
The javascript I have now, located in programs.js in assets/javascript, looks like this:
document.addEventListener('DOMContentLoaded', (event) => {
let program = document.getElementsByClassName('program-name')
console.log(program)
})
Again, the code itself works fine. The problem is that it executes for the homepage, and not for any particular page that I want it to. How would I go about getting the code to execute for a specific page within my rails application?
Why wouldn't you add the javascript tag to the View you want it to run on?
If you wanted a bit better rendering speed, you could add a end-of-page yield to your layout and then specify your javascript in the View like this:
layout/application.html.erb
<!DOCTYPE html>
...
<%= yield(:scripts) %>
</body>
</html>
view/.../index.html.erb
<!-- regular view code here -->
...
<% content_for :scripts %>
<%= javascript_tag do %>
document.addEventListener('DOMContentLoaded', (event) => {
let program = document.getElementsByClassName('program-name')
console.log(program)
});
<% end %>
<% end %>
An other way is to do the following:
app/views/layouts/application.html.erb
<body class="<%= controller_name %> <%= action_name %>">
<!-- This will add your page's controller and action as classes, for example, "blog show" -->
Then, in your script file, you can do the following:
if($('body').is('.yourcontroller.youraction'){
// Do something
}
I have a Rails app that uses the LinkedIn Javascript API to authenticate users. What I'd like to do is hide an element depending on whether the user is signed up or not. I've tried a few things:
Put the code with the if/else statement at the bottom of the HTML before </body>
Check to see if document.cookie is an empty string instead of a more specific if/else
However, neither of these has hidden the element. If I go into my browser's console and paste in my code after the page is finished rendering, the element hides. So I thought this was a JavaScript load issue, but I must be doing something wrong. Can anyone shed some light on this?
Here's the code I've tried, none of which works:
<%= content_for(:script_footer) do %>
<script type="text/javascript">
// if ($('span.IN-widget:contains("inSign in with LinkedIn")').length > 0) {
// $('#select').hide();
// } else {
// $('#select').show();
// }
if (document.cookie == "") {
$('#select').hide();
} else {
$('#select').show();
}
</script>
<% end %>
And my application layout:
<!DOCTYPE html>
<html>
<head>
<title>rdtrip</title>
<%= stylesheet_link_tag "application", :media => "all" %>
<%= yield(:linked_in) %>
<%= javascript_include_tag "application" %>
<%= csrf_meta_tags %>
</head>
<body>
<%= yield %>
<%= yield(:script_footer) %>
</body>
</html>
Wrap your jquery/javascript code with:
$(function(){
// your code here
});
The JavaScript is executed before the DOM is ready, so it can't find #select yet.
Wrap it in either:
$(document).ready( function() {
// code
});
Or:
$(function() {
// code
});
I am using ASP.NET
I have to set the value of a variable [testVar] into Javascript on page load. only for the first time when the page load. Just like !IsPostBack event on code side.
From next postback this function of Javascript should not call. Please let me know how to implement it.
Add this line to your ASPX page:
<% if (!this.IsPostBack) %>
<% { %>
<script type="text/javascript">
document.getElementById("<%= this.timeVar.ClientID %>").value = '1/1/2010';
</script>
<% } %>
So here's a DateTime editor a la NerdDinner's /Views/Shared/EditorTemplates/DateTime.ascx:
%# Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<System.DateTime>" %>
<%: Html.TextBox("", String.Format("{0:yyyy-MM-dd HH:mm}", Model))%>
<script type="text/javascript">
$(function () {
$("#date").datepicker({ showOn: 'focus' });
});
</script>
Since this is a template that's going to be used possibly multiple times on a page, if I'm going to attach the datepicker to each TextBox, they each need a unique ID, and I need to be able to use them in the <script>.
What's the best way to go about doing this?
I'm not much of an MVC programmer, but surely you can just use a class instead of an ID somehow?
<%# Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<System.DateTime>" %>
<%: Html.TextBox("", String.Format("{0:yyyy-MM-dd HH:mm}", Model, new { #class = "datepicker" }))%>
<script type="text/javascript">
$(function () {
$(".datepicker").datepicker({ showOn: 'focus' });
});
</script>