底辺SE奮闘記

年収300万SEブログ

【yubinbango.js】一つのフォームに複数の住所入力欄がある場合躓きやすいポイント

yubinbango.js とても便利ですよね。

github.com

複数住所の場合も対応していてとても便利なのですが、

住所一つのパターンから複数に拡張しようとするとよく躓きます。なのでそのメモを。

  • 一つの場合
<form action="hogehoge" method="POST" class="h-adr">
    <input type="hidden" class="p-country-name" value="Japan">
    <div>
        <label for="">住所</label><input type="text" class="p-postal-code">-<input type="text" class="p-postal-code">
    </div>
    <div>
        <label for="">県名</label>
        <input type="text" class="p-region">
    </div>
    <!-- 中略 -->
</form>
  • 複数の場合
<form action="hogehoge" method="POST" class="h-adr">
    <div class="h-adr">
        <input type="hidden" class="p-country-name" value="Japan">
        <div>
            <label for="">住所1</label><input type="text" class="p-postal-code">-<input type="text" class="p-postal-code">
        </div>
        <div>
            <label for="">県名1</label>
            <input type="text" class="p-region">
        </div>
        <!-- 中略 -->
    </div>
    <div class="h-adr">
        <input type="hidden" class="p-country-name" value="Japan">
        <div>
            <label for="">住所2</label><input type="text" class="p-postal-code">-<input type="text" class="p-postal-code">
        </div>
        <div>
            <label for="">県名2</label>
            <input type="text" class="p-region">
        </div>
        <!-- 中略 -->
    </div>
</form>

躓きやすいポイントは、

<input type="hidden" class="p-country-name" value="Japan">

これの位置です。当たり前なのですが、

<div class="h-adr">
<!-- 中略 -->
</div>

これの中ごとでないとダメなのですね。

以上。

【Laravel・Vue.js】php artisan serve --host 0.0.0.0と初期状態のnpm run hotが両立しない件

環境

  • Laravel 5.7

現象

iOSでの見え方を確認するため

php artisan serve --host 0.0.0.0

を実行。更新をすぐに確認したいので

npm run hot

を実行していた。(実際はyarnだった)

上記の状態でiOS(外部デバイス)からアクセスすると、

画面が真っ白

色々調査を続けているとhtml中に原因を発見

<script src="{{mix('js/app.js')}}">

これが、

<script src="//localhost:8080//js/app.js">

こう展開されているのである。これじゃ外部からは動かないはずだ。

mixの設定を変更してあげることでこの現象を回避できるらしい。わかり次第追記の予定。

妥協案

npm run watch

してからの手動ブラウザリロードで確認する。

解決

これでokです

const mix = require('laravel-mix');

mix.options({
    hmrOptions: {
        host: '[ホスト機のIPアドレス]',
        port: 8080
    }
})
mix.js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css');

【Javascript】Bootstrap-datarangepickerを日本語化する

バージョンによってやり方がよく変わるので...

環境

  • Bootstrap-datapicker 3.0.3

コード

$('#hoge').daterangepicker({
    locale: {
        format: 'YYYY/MM/DD',
        yearSuffix: '年',
        showMonthAfterYear: true,
        monthNames: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
        daysOfWeek:['日', '月', '火', '水', '木', '金', '土'],
        minDate: new Date(),
        maxDate: '+0d',
        hideIfNoPrevNext: true,
        applyLabel:"適用",
        cancelLabel:"キャンセル"
    },
},function(s, e) {
});

【Slim3・mPDF】PDFを表示しようとしたら画面が大変なことになった件

現象

f:id:uma-no-kawa:20190115180254j:plain

大変なことになった

解法

<?php
//中略

$app->get('/pdf', function (Request $request, Response $response) {
    $mpdf = new Mpdf();
    $mpdf->WriteHTML("<h1>Hello World</h1>");
    $mpdf->Output();
    //↓これが重要
    return $response->withHeader('Content-Type', 'application/pdf');
});

【Unity】JSON must represent an object type. への対応

UnityのUnityEngine.JsonUtilityはJsonパースにおいて非常に有用ですが、少し癖が強い感があります。

よくありそうなケース

[
    {
        "id":1,
        "name":"山田"
    },
    {
        "id":2,
        "name":"田中"
    }
]

これがパースできないのです。

これをパースしようとすると、

JSON must represent an object type. 

と出てエラーとなります。

パースできるようにする場合には下記のように変更が必要です。

{
    "persons":[
        {
            "id":1,
            "name":"山田"
        },
        {
            "id":2,
            "name":"田中"
        }
    ]
}

パースするコードは例えばこんな感じ、

using System;
using UnityEngine;

public class MainClass {
    public void main ()
    {
        var jsonStr = "さっきのいい感じのJSON";
        var persons = JsonUtility.FromJson<Persons>(jsonStr);
    }
}

[Serializable]
public class Person{
    public int id;
    public string name;
}

[Serializable]
public class Persons{
    public Person[] persons;
}

【PHP】CPIサーバでImageMagickを動かすときに大変だった件

サポートに問い合わせしたところ、

シェアードZZプランではPHP5.3.29でしかImageMagickが利用できない。

とのこと。

なので、.htaccess

AddHandler x-httpd-php5329 .php

これが必要ということですね。

これはつまり、

Laravelが使えない

ということです。困ったものです。