CODEWITHSUNDEEP
phpformstwitter-bootstraplaravel
Liam Lewis
Liam Lewis

Reputation: 33

Laravel and Bootstrap - Form with no action still sending data

I'm working on a Laravel site built by someone else and one of the pages has a form on it that doesn't have any action or any obvious location the data gets sent to, yet it still sends data to the back-end.

The form below is found on portal.blade.php - I can't find anything in there resembling Form::

If I delete the classes 'inspiring' & 'submit' from the submit button the form stops working.

Live page: http://amazingyou.bravissimo.com/about

<!-- Modal -->
<div class="inspiring modal fade" 
  id="myModal" 
  tabindex="-1" 
  role="dialog" 
  aria-labelledby="myModalLabel" 
  aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" 
         class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
        <h4 class="modal-title" id="myModalLabel">Your Amazing Story</h4>
      </div>
      <div class="modal-body">
        <form>
          <p>
            <input class="name" placeholder="Your Name" value="">
          </p>
          <p>
            <input class="title" placeholder="Story Title" value="">
          </p>
          <p>
            <textarea class="story" 
              placeholder="Your Story (max. 150 words)"></textarea>
          </p>
        </form>
        <div class="results" style="display:none">
          Thank you for your Amazing Story
        </div>
        <div class="character-limit" style="display:none">
          Please limit your story to 150 words
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" 
          class="btn btn-default" 
          data-dismiss="modal">Close</button>
        <button 
          onClick="ga('send', 'event', 'amazing_story', 'click', 'submit_story');" 
          type="button" 
          class="btn btn-primary inspiring submit">Submit</button>
      </div>
    </div>
  </div>
</div>

Upvotes: 2

Views: 399

Answers (2)

whoacowboy
whoacowboy

Reputation: 7447

It appears that your form is being submitted by JavaScript. Look through the JavaScript source files that are being included on this page. If you are using jQuery, look for something like 

$('.inspiring').bind('click', function(e){ ... });

if regular JavaScript look for

document.forms[0].onsubmit = function () { ... } );

Inside there they are probably doing an ajax request, or they set the action and submit the form from there.

Edited per comments

The form is being submitted by this javascript file.

http://amazingyou.bravissimo.com/js/user_inspiring_backbone.js

Line 2 The URL for the form is set here.

InspiringStories = Backbone.Model.extend({
    urlRoot: '/inspiring-stories',
    defaults: {

    },
    initialize: function(){
    }
});

Lines 17-19 Set up the click event.

events: {
    "click .inspiring.submit": "clicked"
},

Line 21 starts the clicked function

Line 78 submit the form when you hit model.save, everything between lines 21 & 78 is form validation.

this.model.save([],{
    dataType:"text",
    success:function(response) {console.log(response)},
    error:function() {}
});

Upvotes: 1

ceejayoz
ceejayoz

Reputation: 180004

I can't find anything in there resembling Form::

You don't have to use the Form:: helpers - standard HTML works fine (but misses some neat features like re-filling the fields with the submitted data if an error occurs).

doesn't have any action or any obvious location the data gets sent to, yet it still sends data to the back-end.

A <form> tag with no attributes defaults to POSTing to the current URL. I suspect some JavaScript catches the click on the .submit button and causes the form tag to be submitted.

Upvotes: 0

Related Questions