フォームのテキスト入力に onfocus と onblur を追加しました。
<form id='AddCameraFormWebcam' name='' method='post' action='<?php echo htmlspecialchars($_SERVER['REQUEST_URI']); ?>'>
<label for="CameraName">Camera name: </label>
<input id="CameraName" name="camera_name" size="24" maxlength="36" value="Enter label for camera" onfocus="if(this.value==this.defaultValue){this.value=''; this.style.color='#000';};" onblur="if(this.value==''){this.value=this.defaultValue; this.style.color='#666';}" />
...
<button type='submit' class='submit_camera' name='addcamera' value='Add'>Add</button>
</form>
これは、jquery で行った検証を破るようになりました。
$(".submit_camera").click(function() {
$("#AddCameraFormWebcam").validate({
rules: {
camera_name: {
required: true,
cameravalidation: true,
minlength: 3,
maxlength: 32
}
},
messages: {
camera_name: {
required: "Enter a label for your camera",
minlength: jQuery.format("At least {0} characters required!"),
maxlength: jQuery.format("Maximum {0} characters allowed!")
}
}
});
});
Enter label for camera
がサーバーに送信されるため、カメラ名を入力しなくても送信できるようになりました。どうすればエラーを表示できますか?