Inputタグのコーディングが長くなってしまいコーディングが見づらい

Question

個人の主観なので皆様とは考えが異なるかもしれないのですが...

inputタグのコーディングが1行で記載すると長くなってしまい見づらいと感じているのですが、皆様はどのようにご対応されておりますか？
そもそも見づらいと感じることはなく、ケアレスミス等はあまりない状態なのでしょうか？

$InputDefJs = ' onFocus="PostActiveFocus(this.id);" onKeyUp="KeyDownNextForcus(event.which,this.id,10);"';

<input class='wid120 alignright sirskcyosei sirsksougoukei' name='henpin' id='henpin' type='text' value='<?php echo $_POST["henpin"] ?>' <?php echo $InputDefJs ?> onBlur='ChangeBgWhite(this.id);numcmadd("henpin");classcal("scyoseigoukei","sirskcyosei");classcal("ssougoukei","sirsksougoukei");' tabindex='1005'>

これは一例で、割と記載が少ないものを選んだのですが、これでも1行で記載すると長いなと感じております。

分かりづらい質問で大変恐縮ですが、
どのようにコーディングを書いているか等ございましたら、教えていただけると幸いです。よろしくお願いいたします。

Answer 1

基本はエディタで折り返し表示しますけど、いちおうこういう書き方も可能です。
プロパティごとに改行させると可読性が大きく上がります。

	<input 
		type="text"
		name="hoge"
		value="fuga"
		placeholder="piyo"
	>

※あと、可読性は大きく下がりますが、こういうこともできないことはないです。

	<input 
		type="text"
		name="ho
		ge"
		value="fuga"
		placeholder="piyo"
		onclick="testtest
		test()"
	>

さて、問題はPHPですが、自分はヒアドキュメントを使うことが多いですね。

$hoge <<< EOM
 "寿限無寿限無五劫の擦り切れ
　パイポパイポのシューリンガン"
EOM;

PHPで長い文字列を扱う方法色々

けど、可読性だけのために無理をさせるぐらいならエディタで折り返し表示、それが一番無難だと思います。

Comments

[useruser001]

ご回答ありがとうございます。
お恥ずかしながら「可読性」という言葉を初めて見たのですが、まさにこの言葉の通り読みやすさのためだけに改行するのはどうなのかな？とも思っておりました。
ヒアドキュメントについては普段使用していなかったので勉強してみたいと思います。

Answer 2

inputタグのコーディングが1行で記載すると長くなってしまい見づらいと感じているのですが

複数行で書く、という選択肢はないのですか？（タグ内の属性と属性の間で改行しても全く問題ありません）

<input 
  class='wid120 alignright sirskcyosei sirsksougoukei' 
  name='henpin' 
  id='henpin' 
  type='text' 
  value='<?php echo $_POST["henpin"] ?>' 
  <?php echo $InputDefJs ?>
  onBlur='ChangeBgWhite(this.id);numcmadd("henpin");classcal("scyoseigoukei","sirskcyosei");classcal("ssougoukei","sirsksougoukei");' 
  tabindex='1005'
>

Comments

[maisumakun]

それでもonBlurは長いですが、基本的にHTMLのon***属性にJavaScriptコードを直書きすることそのものが好まれません。

[useruser001]

ご回答ありがとうございます。
”複数行で書く”というのも思い付きはしたのですが、inputタグが多い場合それはそれで見づらくなってしまうなとも思っており、複数行で書く以外の方法はあるのかな？と思い質問させていただきました。
そもそも論でonXXX属性のコードを直接書くことが良くないのですね。
勉強になりました。

Answer 3

PHP側でonXXXの処理を記載するのはイマイチですね
バック側はフロントの挙動の面倒を見るべきではありません。
たとえばクラスやid、カスタムデータなどを付加してHTMLを返してやり
フロントがそれを見て別途JSを組み込んでいくのが妥当でしょう

Comments

[useruser001]

ご回答ありがとうございます。
php側onXXXの処理が良くないのですね。
恥ずかしながらバック側、フロント側について特に意識せずこのような書き方をしておりました。