set custom alert form validation

<form id="form" onsubmit="return(login())">
<input name="username" placeholder="Username" required />
<input name="pass"  type="password" placeholder="Password" required/>
<br/>Remember me: <input type="checkbox" name="remember" value="true" /><br/>
<input type="submit" name="submit" value="Log In"/>


var elements = document.getElementsByTagName("INPUT");
for (var i = 0; i < elements.length; i++) {
    elements[i].oninvalid = function(e) {
        e.target.setCustomValidity("");
        if (!e.target.validity.valid) {
            e.target.setCustomValidity("This field cannot be left blank");
        }
    };
    elements[i].oninput = function(e) {
        e.target.setCustomValidity("");
    };
}

CodeIgniter object not found only the index function works

Create a .htaccess file on root where is index.php
and put the code.


DirectoryIndex index.php
RewriteEngine on

RewriteCond $1 !^(index\.php|(.*)\.swf|forums|images|css|downloads|jquery|js|robots\.txt|favicon\.ico)
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ ./index.php?$1 [L,QSA]

Confirm password validation with Customized error messages

HTML
<form class="my-form">
    <fieldset>
        <legend>Confirm password with HTML5</legend>

        <input type="password" placeholder="Password" id="password" required>
        <input type="password" placeholder="Confirm Password" id="confirm_password" required>

        <button type="submit" class="pure-button pure-button-primary">Confirm</button>
    </fieldset>
</form>

SCRIPT
var password = document.getElementById("password")
  , confirm_password = document.getElementById("confirm_password");

function validatePassword(){
  if(password.value != confirm_password.value) {
    confirm_password.setCustomValidity("Passwords Don't Match");
  } else {
    confirm_password.setCustomValidity('');
  }
}

password.onchange = validatePassword;
confirm_password.onkeyup = validatePassword;

HTML5 required attribute one of two fields

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form method="post">
  Telephone:
  <input type="tel" name="telephone" value="" required>
  <br>Mobile:
  <input type="tel" name="mobile" value="" required>
  <br>
  <input type="submit" value="Submit">
</form>

<script>

jQuery(function ($) {

    var $inputs = $('input[name=telephone],input[name=mobile]');
    $inputs.on('input', function () {
        // Set the required property of the other input to false if this input is not empty.
        $inputs.not(this).prop('required', !$(this).val().length);
    });

});

</script>

the file type you are attempting to upload is not allowed. codeigniter xls

add to your config/mimes.php types 'application/octet-stream'

'xls' => array('application/vnd.openxmlformats-officedocument.spreadsheetml.sheet', 'application/zip', 'application/x-zip', 'application/vnd.ms-excel', 'application/msexcel','application/excel','application/vnd.ms-office'),

How to make a ajax call in my custom wordpress plugin.

Step1: Now you have to add the below function in the functions.php file in your plugin

/* If you wanted to also use the function for non-logged in users*/

add_action( 'wp_ajax_nopriv_my_action', 'my_action_callback' ); 

/* with logged in users*/
add_action( 'wp_ajax_my_action', 'my_action_callback' );
function my_action_callback() {
    global $wpdb; // this is how you get access to the database

    $id = intval( $_POST['id'] );
    $status = $_POST['status'];

    echo 'whatever';

    die(); // this is required to terminate immediately and return a proper response
}

Step2: Client Action

    <a href="javascript:void(0)" class=" btn btn-block btn-success actionActive" >Yes Action</a>
 <script>
 $(document).on('click','.actionActive',function(){
 
 var ajaxurl = '<?php echo admin_url('admin-ajax.php'); ?>';
      var data = {
        'action': 'my_action',
        'id'    : '1',
        'status': '2'
      };
      // We can also pass the url value separately from ajaxurl for front end AJAX implementations
      jQuery.post(ajaxurl, data, function(response) {
        alert('Got this from the server: ' + response);
      });
   
  });
  </script>

make image form video url

Step 1.  create a file index.html

  <script src="https://www.zoylu.com/assets/js/jquery.min.js"></script>
<video id="video" controls="controls">
    <source src="t4.mp4" />
</video>
<form name="makeImg" action="makeImg.php" method="post" enctype="multipart/form-data">
 <input type="text" value="" id="imgB64" name="imgB64">
<button id="capture">Capture</button>
<!-- <input type="submit" name="submit" value="Create Image">-->

</form>
<div id="output"></div>

<script>
(function() {
   // "use strict";

    var video, output;
    var scale = 0.60;

    var initialize = function() {
        output = $("#output");
        video = $("#video").get(0);
alert(video);
        $("#capture").click(captureImage);               
    };

    var captureImage = function() {

        var canvas = document.createElement("canvas");
        canvas.width = video.videoWidth * scale;
        canvas.height = video.videoHeight * scale;
        canvas.getContext('2d').drawImage(video, 0, 0, canvas.width, canvas.height);

        var img = document.createElement("img");
var imgd = canvas.toDataURL();
alert(imgd);
$('#imgB64').val(imgd);
        img.src = canvas.toDataURL();
        output.prepend(img);
    };

    $(initialize);           

}());</script>

Step 2.
create makeImg.php file

$data = $_REQUEST['imgB64'];
list($type, $data) = explode(';', $data);
list(, $data)      = explode(',', $data);
$data = base64_decode($data);
file_put_contents('image.png', $data);