Executing a Ruby on Rails controller method from JavaScript

Currently working on a scrabble application and aiming to trigger an update method once the player moves a tile, updating its position within the database.

 function changeTilePosition(event, posX, posY)
  {

    new Ajax.Request('/tiles_controller/update', {
    method: 'post',
    parameters: {
      posX: posX,
      posY: posY
    }
    });
}

Here's how my controller is set up:

def update
  @tile = Tile.find(params[:id])
  @tile.update_attributes(params[:tile])
end

I'm aware that my controller code isn't functioning correctly. I am fairly new to Rails and unsure of how to properly pass parameters from JavaScript to the server.

Your assistance would be greatly appreciated.

Answer №1

To include the URL, you can use the following format:

new Ajax.Request('<%= tile_update_path %>'

Additionally, there are numerous methods for transmitting JavaScript information from your controller. One useful tool is a gem called gon - I recommend giving it a try.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Encountering difficulty extracting information from an XML document within the Parse Cloud utilizing the XMLReader in an Express application

My goal is to extract elements from an XML file that I have already stored on the Parse Cloud for my Express app. I began coding after finding a helpful resource on using XMLReader with XPath on cloud code, as well as a guide on Parse httpRequest for retri ...

"jquery-ajax was unable to complete the request, whereas it was successfully executed using

I am currently using jQuery to trigger an ajax request. However, when I make the request using jQuery, I encounter an "Unexpected end of input" error with no response coming from the PHP file. Strangely enough, if I manually copy the request from the Chrom ...

The following item in the .each() sequence

How can I move on to the next element within a jQuery .each() loop? $(".row").each( function() { if ( ... ) //move to the next iteration in the .each() loop }); Appreciate any assistance. Thank you. ...

Show a message on form submission rather than redirecting

I'm working on a simple sign-up form and I want to show a success message directly on the page instead of redirecting to another page after submission. Is it better to display the message as a pop-up, an alert, or just on the page itself? <form a ...

Can you merge multiple req.body requests?

I am exploring a scenario where I have a list of items that need to be iterated through, with each item having the value of i added to it to retrieve the next set of information. For example: By concatenating the string "req.body.item" + i + "Title", you ...

transform the usage of jquery.submit into ajax submit

I'm having trouble figuring out how to submit a form using Ajax from the jquery ui button function. This is my code for submitting the form in a traditional way $('#contact-form').dialog({ modal: true, autoO ...

Loading a div class dynamically with JQuery

It's clear to me there is an issue with my code, and I'm reaching out for assistance. Here is the problematic snippet that needs fixing. Currently, I'm encountering this error message: Uncaught TypeError: Cannot read property 'find&apos ...

jQuery dialog unexpectedly expanding to full page in web browser

My issue involves a WebGrid dialog that showcases a list of items: @if (Model.ItemsByLocation != null) { @grid.GetHtml( tableStyle: "table", fillEmptyRows: true, headerStyle: "header", footerStyle: "footer", mode: WebGridPagerMode ...

Node.js user update complete

I am currently working on enabling users to edit their profiles. However, the code I have set up does not seem to be functioning as expected. The form I am using looks like this: <form action="/dashboard/users/edit/:id" method="put"> And my route ...

Fixing a glitch with ajax pagination

I've been attempting to incorporate ajax pagination into my codeigniter project. Here is the code I have so far: <script type="text/javascript"> $(function() { applyPagination(); function applyPagination() { $("#ajax_pagingsearc a").on ...

Guide on Automatically Retrieving the Newest Data from a Database as it is Added

Is there a way to automatically fetch the latest data from the database and display it on my web page using PHP, AJAX, JQuery? I have implemented the following code successfully. However, I am looking for a solution to continuously update and display new ...

A sleek CSS text link for a stylish video carousel

I am attempting to create a CSS-only text link to video slider within our Umbraco CMS. Due to the limitations of TinyMCE WYSIWYG, I am restricted in the amount of code I can use as it will strip out most of it. So far, I have developed a basic CSS slider ...

Combining JSON objects in a Pentaho JavaScript JSON by matching keys to merge with an existing JSON document

My goal is to construct a Json document by breaking it down into smaller pieces, with each piece containing the necessary keys to insert the smaller Json bits into the correct json structure. As I am relatively new to JavaScript and still in the process of ...

Updating tag content dynamically using jQuery

I have the following HTML code: <div class="selfclear"> <h3><a id="lnkName" href="/dir/subdir/?id=577">Name</a></h3> <address> Street name, 3 <br />3222 City<br />Phone. ...

Using jQuery dialog to load a form through AJAX and then submitting the form to the modal dialog

I have adapted pieces of code from various sources to create the following script. The links successfully load the edit form in a modal using ajax, but upon submitting the form, the entire page refreshes instead of just the modal. I am seeking a solution ...

The problem with React useState not updating could be due to useRef interference

I'm facing a strange issue with my React code: the useState function is not updating the view, despite trying everything to fix it. To illustrate the problem, I have created a simple example: function(){ const [enterJob, setEnterJob] = useSt ...

What improvements can I implement to enhance the clarity and functionality of this form handler?

As a beginner working on my first Next.js app, I'm facing some challenges that seem more React-related. My app allows users to add and edit stored food items and recipes, requiring me to use multiple submit form handlers. Each handler involves: Che ...

Using JavaScript, swap out the default "item added to cart" message with a custom Sweet Alert notification in WooCommerce

After removing the standard "Added to cart" message provided by WooCommerce, I have implemented a new code snippet using Sweet Alert. The goal is to eliminate all default "added to cart" messages and exclusively use the Sweet Alert feature. Although my co ...

Better ways to conceal notifications as soon as a new one appears with Toastr

Whenever a new notification pops up in my application, I desire for the previous one to automatically disappear. It is crucial for only one notification to be displayed at any given time. Is there a way to accomplish this using toastr? ...

Guide to manipulating DOM elements with Angular.js: inserting or deleting elements using createElement

Within my Angular directive, I am dynamically generating an external script from the DOM for a specific object within a list. This script includes both a 'script' tag and div content. While I am able to successfully add the script, I am encounter ...