[Laravel][Vue.js] Laravel + vue で郵便番号から住所を取得

バージョン Laravel 5.8 Vue.js 2.6.10 概要郵便番号-住所検索API (zipaddress.net)の外部APIを呼び出して郵便番号から住所を取得する。 ※なぜこの方式を採用したのかは最後に記載します。以下の流れになる。 vueから自サイトのAPIを呼び出してLaravel側の…

#Laravel #PHP #Vue.js

2019-12-28

[vue.js][Javascript] リアクティブに一覧表の一部の値を更新する

Laravel Vue.js Javascript

バージョン Vue.js 2.6.10 概要一例として一覧表示の該当項目行の一部の値を更新し、その内容をリアクティブに表示反映する。指定行を削除するのはググるとヒットしやすいが行の値の一部だけを更新するのがなかったので記載する。コード ◾️hoge.vue <script> expo…

#Vue.js #Javascrip

2019-12-14

[PHP][Laravel][vue.js][Javascript] vueで空白項目を登録する際にバリデーションでnullableを設定しても動作しない対応

Javascript Laravel PHP Vue.js

バージョン Laravel 5.8 Vue.js 2.6.10 概要たとえばURL登録フォームのバリデーション設定が以下の場合 'url' => 'max:100|nullable|active_url', 空白の場合はバリデーションで引っかからないはずだが vueから登録しようとするとactive_url（urlバリデーシ…

#Laravel #PHP #Vue.js #Javascript

2019-07-07

[Bootstrap] Bootstrap 4 で確認ダイアログを表示し、選択ボタンを判断してsubmitする

bootstrap jQuery Javascript

バージョン Bootstrap 4 概要以下のケースを想定。一覧表に「削除」ボタン(type=button)が複数あり、クリック時にBootstrap 4の確認ダイアログを表示して「はい」なら選択した行のキーをsubmitする。 Bootstrap 4の確認ダイアログを出すだけなら公式サイ…

2019-06-23

[PHP][Laravel] リダイレクトでbladeのjsに配列を渡す

Laravel PHP Javascript

バージョン Laravel 5.7 概要バリデーションエラーなどでリダイレクトで元の画面に戻した際に入力データ以外にPHP側で用意した配列情報をbladeのJavascriptに渡す。コード ■TestController.php // バリデータ if ($validator->fails()) { // 渡すデータ配…

2019-06-09

[Javascript][jQuery] セレクトボックス　メインカテゴリーとサブカテゴリーを連動させる

Javascript jQuery

概要 select要素のセレクトボックスで階層化されたメインカテゴリーを選択すると関連したサブカテゴリーに表示を連動させる。 ①サブカテゴリーの初期表示は未選択状態を示すoption要素のみを表示 ②メインカテゴリーで項目を選択する ③サブカテゴリーは連動…

2019-06-01

[Javascript] ジグザク線(zig zag line)、波線を描画する

Javascript

ジグザグ線（波線）を描画する開始点と終了点を指定し、ジグザグ線を描画する方法。 Javascriptだけでなく他の言語でも応用できる。 <html> <head> <script> class Point{ constructor(x,y){ this.x = x; this.y = y; } } var startP = new Point(50,60); var endP = new Point</head></html>…