JQuery adding request issue

Question

I have a database in which I add new records using Ajax requests and it works fine. By far I wrote a request which is adding properly new records right after already existing ones. I don't know what methods to use to add a new record when database is empty. How could adding request look like in my case? I'm sorry I'm only the beginner to Javascript. Thanks in advance.

views/tasks/create.js

$('.tasks').last().after("<%=j render partial: 'task', :locals => { :task => @task } %>");

views/tasks/_task.html partial

<tr class='tasks' id="task_<%= task.id %>">
  <td>
    <%= link_to user_task_path(current_user, task.id), method: :delete,
     data: { confirm: 'Are you sure?' }, remote: true do %>
      <i class="glyphicon glyphicon-trash"></i>
    <% end %>

    <a href="#" data-xeditable="true" data-pk="task" data-model='task' data-name='title'
      data-url="/users/<%= current_user.id %>/tasks/<%= task.id %>" data-title="Enter title">
      <i><%= task.title %></i>
    </a>

  </td>
</tr>

Here's my view file views/tasks/index.html file

   <h3>Tasks database</h3>

<table>
<% @tasks.each do |task| %>
<tr class='tasks' id="task_<%= task.id %>">
  <td>
    <%= link_to user_task_path(current_user, task.id), method: :delete,
     data: { confirm: 'Are you sure?' }, remote: true do %>
      <i class="glyphicon glyphicon-trash"></i>
    <% end %>

    <a href="#" data-xeditable="true" data-pk="task" data-model='task' data-name='title'
      data-url="/users/<%= current_user.id %>/tasks/<%= task.id %>" data-title="Enter title">
      <i><%= task.title %></i>
    </a>

  </td>
</tr>
<% end %>

<tr>
  <td><%= render 'form' %></td>
</tr>

</table>

There seems to be no ajax requests or databases in this code, if you mean .after() it's a method for inserting DOM elements ? — adeneo
– adeneo, Commented Jul 26, 2015 at 11:42

adeneo · Accepted Answer · 2015-07-26 12:29:17Z

3

You can check if there are any .tasks present, and act accordingly

var tasks = $('.tasks');

if ( tasks.length > 0 ) {
    tasks.last().after("<%=j render partial: 'task', :locals => { :task => @task } %>");
} else {
    $('table').prepend("<%=j render partial: 'task', :locals => { :task => @task } %>")
}

edited Jul 26, 2015 at 12:29

answered Jul 26, 2015 at 11:45

adeneo

319k29 gold badges410 silver badges392 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Alex Nikolsky Over a year ago

Thanks. Although it works, the records appear below the input form when database is empty and not above it. Maybe you could know how to fix it?

Alex Nikolsky Over a year ago

And of course I would be pleased If you recommended some literature or guides so I can improve my knowledge of this

adeneo Over a year ago

Try prepend instead, and you could start by reading the jQuery docs

Collectives™ on Stack Overflow

JQuery adding request issue

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related