Render data from mongoose using EJS partials - express

I'm trying to get my task-manager app to render tasks stored in mongoDB via mongoose on my projects.ejs which contains three as follows:
<%- include("partials/taskCard", {taskState:"New task",}) %>
<%- include("partials/taskCard", {taskState:"In progress"}) %>
<%- include("partials/taskCard", {taskState:"Completed tasks"}) %>
I tried, rendering tasks individually using the value of the task state in the submit button, however, it only equates to "New task", even when other buttons are clicked
<button
class="btn task-submit-btn"
name="submitTaskButton"
value="<%= taskState %>"
type="submit"
>
ADD
</button>
Rendered task.
The code is available on Github

Related

Rendering js generated SVG in PDF in Rails

Trying to render an SVG generated with svg.js in a PDF (wkhtmltopdf) in Rails 5 but nothing comes out. All other rendering in the PDF works so it's likely the JS not being called but I can't understand why. Rendering the JS in a plain HTML view works so I'm sure the actual JS works.
In my show.pdf.erb
<head>
<script src="https://cdn.jsdelivr.net/npm/#svgdotjs/svg.js#3.0/dist/svg.min.js"></script>
<%= wicked_pdf_stylesheet_link_tag "application" %>
<%= wicked_pdf_javascript_include_tag "svg_graph" %>
</head>
In assets/javascripts/svg_graph.js
var svg_graph = ({
.....
lots of js (a function called initialize among others)
.....
);
In show.print.erb:
<div class="pdf-page">
<div class="content">
<%= render 'svg_graph', location_id: location.id %>
</div>
<%= render 'footer' %>
</div>
And in svg_graph.html.erb:
<div class="svg-graph mt-3" id="svg-graph-<%= location_id %>"></div>
<script>
svg_graph.initialize(document.getElementById("svg-graph-" + <%= location_id %>), <%= location_id %>);
</script>
Any idea where I'm going wrong?

Form Help In Hanamirb (Lotusrb)

Does hanami support below code?
<%= form_for :question, routes.question_path. method: 'post' do %>
<div class="box-body">
<div class="row">
<div class="box-body pad">
<textarea id="content"></textarea>
</div>`enter code here`
</div>
</div>
<% end %>
And how can I can do it in my template?
Though this is possible, the official Hanami guide discourages it as it has to resort to monkey patching in order to work with the various template engines.
You can read more about it here.
An alternative approach is to define a single form rendering method in your view, like this:
def form
form_for :question, routes.questions_path, method: 'post' do
div(class: 'box-body') do
div(class: 'row') do
div(class: 'box-body pad') do
text_area :content, id: 'content'
end
end
end
end
end
Then, somewhere in your template, you can call it like this to render the form:
<%= form %>
And I'm supported by author the best way I want is:
<form action="<%= routes.question_path %>" method="POST">
<input type="hidden" name="_csrf_token" value="<%= csrf_token%>">
<!-- rest of the form goes here -->
</form>
Maybe it's help for someone else.

Rails 3 Submit Tag + html_safe

What's wrong with this line of code?
<%= submit_tag "Delete <i class='icon-check'></i>".html_safe, :disable_with => "Deleting", :class => "btn btn-danger"%>
This literally produces:
Evidently my html_safe call isn't doing anything.
Background:
I'm using Twitter Bootstrap as well as Font Awesome and I'm essentially trying to achieve a submit button with an icon inside of it.
To extend on Lukas' answer I needed a button tag rather than an input. This code produced the effect I was looking for:
<button type="submit" class="btn btn-danger">
Delete <i class="icon-check"></i>
</button>
Which resulted in:
I found the answer I was looking for here.
What's wrong with it? Submit button values should not contain embedded HTML code.
This is how submit button looks in HTML:
<input type="submit" value="Submit" />
HTML tags in value attributes are interpreted as text, not as HTML:
<input type="submit" value="<i>Submit</i>" />
<%= form.button :submit, class: 'btn btn-success' do %>
<i class="fa fa-plus"></i> Add Funder <i class="fa fa-chevron-right"></i>
<% end %>
This is good answer.

Routing error from jQuery UI tabs with ajax

I'm using Rails and jQuery UI to implement tabs in each user's profile. I've got it working without ajax - with ajax, things go south. I'm new to Rails and jQuery and am hoping someone can help me identify what's going wrong.
<div id="tabs-1"> is the first tab and it is associated with ProfilesController by default. That works by using an <a href>.
<div id="tabs-2"> would access MessagesController and load a partial show_messages that loads #user.messages.
What happens instead is that when I click "Messages" I get an ActionController::Routing error in Profiles#show.
No route matches {:action=>"show", :controller=>"messages", :id=>[#<Message id: 3, user_id: 2,...>, #<Message id: 4, user_id: 2,...">]}
My code is below:
application.js:
$(function() {
$( "#tabs" ).tabs({
ajaxOptions: {
error: function( xhr, status, index, anchor ) {
$( anchor.hash ).html(
"Couldn't load this tab. We'll try to fix this as soon as possible. " +
"If this wouldn't be a demo." );
}
}
});
});
My profile show.html.erb:
<div id="tabs">
<ul id="infoContainer">
<li></li>
<li><%= link_to "Messages", message_path(#user.messages) %></a></li>
<ul>
<div id="tabs-1">
</div>
</div>
My _show_messages partial in MessagesController:
<div id="tabs-2">
<% for 'message' in #user.messages %>
<div class="message">
</div>
<% end %>
</div>
in show.html.erb message_path(#users.messages) is wrong. Try messages_path which should point to the index action of the messages controllr. Here I am assuming you are using the standard Rails convection for messages routes.

Rails 3 template not loading in jQuery UI Tabs

I have a Profile in my Rails 3 app. When the Profile is viewed, the Profile's about information shows in a div container by default. What I want to do is replace the "about" information in the div with messages from the User when a "messages" link is clicked. (The messages should load according to the profile_messages template.) To do this, I turned to jQuery UI Tabs.
So the "about" information exists in Tab-1. The "Messages" is in a template called profile_messages that I've tried loading from both the ProfilesController and the MessagesController.
I've gotten a lot of help here on SO to get to where I'm at. However, for some reason I can't get the actual messages to show up. What happens when I click "messages is I see the error message in my jQuery. If I inspect the element, I see this:
Failed to load resource: the server responded with a status of 404 (Not Found) `profile_messages`
Here is my code. If anyone can help me figure out what's going on I'd appreciate it greatly.
ProfilesShow show.html.erb:
<div id="tabs">
<ul id="infoContainer">
<li>About</li>
<li><%= link_to "Messages", "/profiles/profile_messages", :remote => true %></li>
</ul>
<div id="tabs-1">
</div><!-- end profile-about -->
profile_messages.html.erb:
<div id="tabs-2">
<% for 'message' in #user.messages %>
<div class="message-1">
</div>
</div><!-- end messages -->
<% end %>
ProfilesController:
def show
#profile = Profile.find(params[:id])
#user = User.find(#profile.user_id)
end
Routes.rb:
resources :messages do
resources :responses
end
resource :messages do
collection do
get :profile_messages
end
end
profile_messages.js.erb:
$( "#tabs" ).html( "<%= escape_javascript( render(#profile.messages) ) %>" );
From rake routes:
message GET /messages/:id(.:format) {:action=>"show", :controller=>"messages"}
profile GET /profiles/:id(.:format) {:action=>"show", :controller=>"profiles"}
profile_messages_messages GET /messages/profile_messages(.:format {:action=>"profile_messages", :controller=>"messages"}
jQuery UI Tabs:
$(function() {
$( "#tabs" ).tabs({
spinner: '<img src="">' },{
ajaxOptions: {
error: function( xhr, status, index, anchor ) {
$( anchor.hash ).html(
"There was an error loading this tab. Please try again." );
}
}
});
});
As I said, I'm really close so if anyone can help me figure out what I'm doing wrong I'd appreciate it.
UPDATE: If I switch the route from profiles/profile_messages to messages/profile_messages here is the HTML output of the jQuery UI Tabs:
<div id="tabs">
<ul id="infoContainer">
<li>About</li>
<li>Messages</li>
</ul>
<div id="tabs-1">
Here is what I see in Firebug:
<div id="tabs" class="ui-tabs ui-widget ui-widget-content ui-corner-all">
<ul id="infoContainer" class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all">
<li class="ui-state-default ui-corner-top ui-tabs-selected ui-state-active">About</li>
<li class="ui-state-default ui-corner-top">Messages</li>
</ul>
<div id="tabs-1" class="ui-tabs-panel ui-widget-content ui-corner-bottom">
</div>
</div>
The fact that Firebug shows the second link as #ui-tabs-1 seems odd to me.
The routes output says it all: profile_messages_messages, but you also need to append _path--if you were using the generated path variable and not using a string path.
Does this route exist?
/profiles/profile_messages
This is what you are calling from your link_to. From your routes output, it seems this should be:
/messages/profile_messages
Thanks to the combined efforts of folks here on SO I was able to get this to work. Check out these questions for more code:
Exclude application layout in Rails 3 div
Rails 3 jQuery UI Tabs issue loading with Ajax