Código

Algunas notas para mí

Linux SSH login without passwords

Step 1:Create public and private keys using ssh-key-gen on local machine

user@localhost$ ssh-keygen
Generating public/private rsa key pair.
Enter file in which to save the key (/home/user/.ssh/id_rsa):[Enter key]
Enter passphrase (empty for no passphrase): [Press enter key]
Enter same passphrase again: [Pess enter key]
Your identification has been saved in /home/user/.ssh/id_rsa.
Your public key has been saved in /home/user/.ssh/id_rsa.pub.

Step 2: Copy the public key to remote host using ssh-copy-id on localhost

user@localhost$ ssh-copy-id -i  ~/.ssh/id_rsa.pub remote_user@remote_host

Step 3: Login to remote host without entering the password

ssh remote_user@remote_host

Javascript JQuery find element by data attribute

  • HTML
<div class="form-group ">
    <label for="Model[name]">Name</label>
    <input data-propertyX="example" id="Model_name" name="Model[name]" class="form-control" type="text" placeholder="Name" value="">
</div>
  • Javascript search by data-property
$( document ).ready(function() {
  var searchBY = 'example';
 
  // select by class or another html label and then filter by data attribute name
  var fieldForm = $('.form-control').filter('[data-propertyX="' + searchBY + '"]');
 
  // now we can do whatever with the input field 
  fieldForm.val('Field selected by data-propertyX');
});

Javascript repeat every X seconds

  • Javascript
function updateData() {
$.ajax({
        'type':'get',
        'url':'ajaxExample.php',
        'cache':false,
        'success':function(data){
                $('#ajax-example-results').html(data);
            }
        }        
    });
}
 
updateData();
// refresh every 5 seconds
var auto_refresh = setInterval(function(){ updateData() }, 5000);
  • Server part (PHP example)
  // echo whatever every 5 seconds in #ajax-example-results 
  echo $output;
}

JQuery AJAX examples

Ajax request when an user type in an form input field

  • HTML
<input type="text" name="example" id="example" class="example-class" />
<div id="ajax-example-results"></div>
  • Javascript
$('.example-class').on('keyup', function () {
        var value= 'example=' + $(this).val();
        $.ajax({
            'type': 'post',
            'data': data,
            'url': 'ajaxExample.php',
            'success': function (data) {
                $('#ajax-example-results').html(data);
            }
        });
    });
  • Server part (PHP example)
if (isset($_POST['example'])) {
  // do whatever with the data and echo something to fill "ajax-example-results" div
  echo $output;
}

Send Ajax request when an user submit a form

  • HTML
<form id="example-form" name="example-form" method="post" action="">
  <label for="model[name]">
  <input type="text" name="model[name]" id="model_name" class="example-class" />
  <div id="ajax-example-results"></div>
  <input type="submit" value="Send">
</form>
  • Javascript
$('#example-form').submit(function () {
  var formData = $(this).serializeArray();
  $.ajax({
            'type': 'post',
            'data': formData,
            'url': 'ajaxFormController.php',
            'success': function (data) {
                $('#ajax-example-results').html(data);
            }
        });
});
  • Server part (PHP example)
if (isset($_POST['model'])) {
  // do whatever with the data and echo something to fill "ajax-example-results" div
  echo $output;
}

Send Ajax request with JSON

  • HTML
<form id="example-form" name="example-form" method="post" action="">
  <label for="model[name]">
  <input type="text" name="model[name]" id="model_name" class="example-class" />
  <div id="ajax-example-results"></div>
  <input id="form-submit" type="submit" value="Send">  
</form>
  • Javascript
$('#example-form').submit(function () {
  var formData = $(this).serializeArray();
  $.ajax({
            'type': 'post',
            'data': formData,
            'url': 'ajaxFormController.php',
            'dataType': 'json',
            'beforeSend': function (dataJSON) {
                $('#ajax-example-results').show();
                $('#ajax-example-results').html('Sending...');
                $(this).find("button[type='submit']").prop('disabled',true);
            },
            'success': function (dataJSON) {
                if (dataJSON.status === true) {
                    $('#ajax-example-results').html(dataJSON.html);                    
                } else {
                    $('#ajax-example-results').html('Error X');                    
                }
                $(this).find("button[type='submit']").prop('disabled',false);
            },
            'error': function (dataJSON) {
                $('#ajax-example-results').html('Unexpected error');                
                $(this).find("button[type='submit']").prop('disabled',false);
            }
  });
});
  • Server part (PHP example)
if (isset($_POST['model'])) {
  // do whatever with the data and echo something to fill "ajax-example-results" div
  $output = ['status' => true, 'html' => $whatever];
  echo json_encode($output);
}

Javascript validate form before submit

Some functions to validate a form before submit

  • HTML form
<form name="example-form" method="post" action="">
  <div class="form-group ">
    <label for="Model[name]">Name</label>
    <input id="Model_name" name="Model[name]" class="form-control" type="text" placeholder="Name" value="">
  </div>
  <input type="submit" value="send" class="btn btn-primary">
</form>
  • Javascript functions
/**
 * Checks if a field is empty
 * @param {string} fieldName html label 'name'
 * @param {string} additionalText [optional] 
 * @returns {String}
 */
function validateRequireFieldByName(fieldName, additionalText)
{
    additionalText = typeof additionalText !== 'undefined' ? additionalText : '';
 
    var field = $('[name="' + fieldName + '"]');
    var fieldValue = field.val();
    var parent = field.parent();
 
    if (fieldValue) {
        parent.removeClass("has-error").addClass("has-success");
        return '';
    } else {
        padre.removeClass("has-success").addClass("has-error");
        var label = parent.children("label").text();
        return label + ' ' + additionalText + ' is required\n';
    }
}
  • Main function to validate before submit
$('#example-form').on('submit',function(event) {
    var formData = $(this).serializeArray();
    var errorMessage = '';
 
    for (var input in formData){
        var element = $('input[name="' + formData[input].name +'"]');
        var fieldName = element.attr('name');
 
        errorMessage += validateRequireFieldByName(fieldName);        
    }
 
    if (errorMessage !== '') {
        event.preventDefault();
        alert(msgError);
    }
 
});

Páginas