ECN>> laravel-data-method>> 返回
项目作者： brexis

项目描述 ：
Useful Laravel form submission helpers
高级语言： JavaScript
项目地址: git://github.com/brexis/laravel-data-method.git
创建时间： 2017-04-28T12:06:59Z
项目社区：https://github.com/brexis/laravel-data-method
开源协议：
下载


laravel-data-method

This repo provides helpers for form submission in Laravel like link form submission, disabling submit button on form.

Install

Via npm

  1. $ npm install laravel-data-method --save

Via bower

  1. $ bower install laravel-data-method --save

Usage

  1. <!DOCTYPE html>
  2. <html lang="en">
  3.     <head>
  4.         <meta charset="utf-8">
  5.         <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6.         <meta name="viewport" content="width=device-width, initial-scale=1">
  8.         <!-- CSRF Token -->
  9.         <meta name="csrf-token" content="FAKETOKEN">
  11.         <title>Laravel Data Method</title>
  13.         <!-- Styles -->
  14.         <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
  16.         <!-- Scripts -->
  17.         <script type="text/javascript" src="node_modules/jquery/dist/jquery.js"></script>
  18.         <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
  19.         <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
  20.         <script src="https://cdn.jsdelivr.net/npm/sweetalert2@9"></script>
  21.         <script type="text/javascript" src="./dist/data-method.js"></script>
  22.     </head>
  23.     <body>
  24.         <p>
  25.             <!-- Link form with confirmation and params -->
  26.             <a
  27.                 href="/"
  28.                 class="btn btn-primary"
  29.                 data-method="POST"
  30.                 data-params='{"id": 4}'
  31.                 data-confirm="Are you sure?">Submit Me</a>
  33.             <!-- Link form with confirmation with bootstrap theme -->
  34.             <a
  35.                 href="/"
  36.                 class="btn btn-primary"
  37.                 data-method="POST"
  38.                 data-confirm="Are you sure?"
  39.                 data-title="Please confirm this action"
  40.                 data-theme="bootstrap">Submit Me with bootstrap theme</a>
  42.             <!-- Link form with confirmation with sweetalert2 theme -->
  43.             <a
  44.                 href="/"
  45.                 class="btn btn-primary"
  46.                 data-method="POST"
  47.                 data-confirm="Are you sure?"
  48.                 data-title="Please confirm this action"
  49.                 data-theme="sweetalert">Submit Me with Sweet Alert theme</a>
  51.             <!-- Link form with confirmation with javascript -->
  52.             <a
  53.                 href="javascript:dataMethod('/', {confirm: 'Are you sure?', method: 'POST'})"
  54.                 class="btn btn-primary">Submit with javascript</a>
  56.             <!-- Link form with confirmation with javascript -->
  57.             <a
  58.                 href="/"
  59.                 class="btn btn-primary"
  60.                 data-method="POST"
  61.                 data-params='{"id": 4}'
  62.                 data-ajax="true">Submit with Ajax</a>
  63.         </p>
  65.         <!-- Disable form submit button on submit event -->
  66.         <form action="" method="post">
  67.             <button class="btn btn-success" type="submit" data-disabled-submit>Disable form button</button>
  68.         </form>
  70.         <!-- Disable form submit button on submit event with confirm message -->
  71.         <form action="" method="post" class="mt-3">
  72.             <button class="btn btn-success"
  73.                 type="submit" data-disabled-submit
  74.                 data-confirm="Are you sure?">Disable form button with confirm</button>
  75.         </form>
  77.         <!-- Disable form submit button on submit event with bootstrap theme -->
  78.         <form action="" method="post" class="mt-3">
  79.             <button class="btn btn-primary"
  80.                 type="submit"
  81.                 data-disabled-submit
  82.                 data-confirm="Are you sure?"
  83.                 data-title="Please confirm this action"
  84.                 data-theme="bootstrap">Disable form button with confirm Bootstrap</button>
  85.         </form>
  87.         <!-- Disable form submit button on submit event with sweetalert theme -->
  88.         <form action="" method="post" class="mt-3">
  89.             <button class="btn btn-primary"
  90.                 type="submit"
  91.                 data-disabled-submit
  92.                 data-confirm="Are you sure?"
  93.                 data-title="Please confirm this action"
  94.                 data-theme="sweetalert">Disable form button with confirm Bootstrap</button>
  95.         </form>
  97.         <!-- Submit normal form -->
  98.         <form action="" method="post" class="mt-3">
  99.             <button class="btn btn-primary" type="submit">Submit normal form</button>
  100.         </form>
  101.     </body>
  102. </html>

Development

  1. $ git clone https://github.com/brexis/laravel-data-method.git
  2. $ cd laravel-data-method
  3. $ yarn install --production=false
  4. $ npm run build