Monday, September 24, 2018

File form submission by AJAX in custom plugin wordpress

Form (upload-admin.php):
<form id="form-id" name="form-name" method="post" enctype="multipart/form-data">
      <input type="file" id="file-id" name="file-name">
      <input type="submit" id="submit-btn" class="submit_btn" name="submit" value="Upload" />
      <input type="hidden" name="action" value="process_data" />
      <span class="validation-msg"></span>
</form>

<button id="main_submit_btn">Submit</button>

In main starting file add menu hook to call the html form:
function custom_admin() {
  include('upload-admin.php');
}

function now_menu() {
  add_management_page("My Title", "My Title", 1, "now-upload", "custom_admin");

}

function add_file_uploading_js() {
  wp_enqueue_script('my_custom_script', plugin_dir_url( __FILE__ ) . 'js/file_uploader.js', array('jquery'), false, true);
  // Localize the script with new data
  $data = array(
    'ajaxurl' => admin_url('admin-ajax.php')
  );
  wp_localize_script('my_custom_script', 'url_data', $data);
}

function process_data()
{
  global $wpdb, $channels;

  if (isset($_FILES)) {
      $uploaded = media_handle_upload($file, 0);
      $location = (get_attached_file($uploaded));
      if (is_wp_error($uploaded)) {
        wp_send_json_error("Error uploading file: " . $uploaded->get_error_message());
      }
      else {
        wp_send_json_success('Import Done!');
      }
  } else {
    wp_send_json_error('Please upload some files!');
  }
}

add_action('admin_menu', 'now_menu');
add_action('admin_enqueue_scripts', 'add_file_uploading_js');
add_action('wp_ajax_process_data', 'process_data');

file_uploader.js
// Jquery handle submission file form
(function ( $ ) {
$(document).ready(function(){
$(".submit_btn").css({'visibility':'hidden'});
var fileUploadParserUrl = url_data.file_upload_parser_url;

$("#main_submit_btn").click(function(event){
        // event.preventDefault();
        var fd = new FormData();
    var file = $('#FDH-form').find('input[type="file"]');
    var FDHfile = file[0].files[0];
    if (FDHfile === undefined) {
    $('.validation-msg').text('Please select all files! You might have missed one or more of xml file to select!');
    }
    else {
    $('.validation-msg').text('');
                        fd.append('file', FDHfile);
fd.append('action', 'process_data');
// disabled the submit button
        $("#main_submit_btn").prop("disabled", true);
        $('.spinner').css({"visibility":"visible"});
        // First clear xml_data table
        $.ajax({
            url: url_data.ajaxurl,
        data: fd,
        processData: false,
        contentType: false,
        dataType: 'json',
        type: 'POST',
            success: function (response) {
            $('.validation-msg-STH').text('STH_web_guide.xml Import Done!');
                // FINISH uploading and importing for ALL
            $("#main_submit_btn").prop("disabled", false);
                $('.spinner').css({"visibility":"hidden"});
            },
            error: function (e) {
                $("#main_submit_btn").prop("disabled", false);
                $('.spinner').css({"visibility":"hidden"});
            }
        });
    }
});
})(jQuery);

Sunday, September 23, 2018

File form submission by AJAX and PHP

Step 1: First have a look at the HTML form:
<form id="form" id="file-form" name="file_form" method="post" enctype="multipart/form-data">
<input type="file" id="file-input" name="file_input" value="" />
<input type="submit" id="submit-btn" class="submit_btn" name="submit" value="Upload" />
<span class="validation-msg"></span>
</form>

<button id="main_submit_btn">Upload</button>

Step 2: Then handle this form by JS(jQuery) code:
// Jquery handle submission of file
(function ( $ ) {
  $(document).ready(function(){
    $(".submit_btn").css({'visibility':'hidden'});
    $("#main_submit_btn").click(function(event){
      // event.preventDefault();
      var fd = new FormData();
      var file = $('#file-form').find('input[type="file"]');
      var myFile = file[0].files[0];
     
      if (myFile === undefined) {
$('.validation-msg').text('Please select file!');
      }
      else {
        $('.validation-msg').text('');
// disabled the submit button
        $("#main_submit_btn").prop("disabled", true);
        $('.spinner').css({"visibility":"visible"});
        $.ajax({
  url: process.php, // url to process
  data: fd,
  processData: false,
  contentType: false,
  dataType: 'json',
  type: 'POST',
  success: function (response) {
    // Upload succefull
    processFDH(fd, FDHfile);
  },
  error: function (e) {
    $("#main_submit_btn").prop("disabled", false);
    $('.spinner').css({"visibility":"hidden"});
  }
});
      }
  });
})(jQuery);

Step 3: process.php
if (isset($_FILES)) { 
   //
  if (check_upload_error($uploaded)) {
    echo json_encode("Error uploading file: " . $uploaded->get_error_message());
  }
  else {
    ajax_xml_import($file_content['name'], $location);
    echo json_encode('Import Done!');
  }
}
else {
  echo json_encode('Please upload some files!');

}

Tuesday, April 24, 2018

Fetch image url in twig views block template in Drupal 8

-- Use pro_img variable anywhere in your current twig file --
=============================================
{% for row in rows %}
{% set pro_img = file_url(row['content']['#row']._entity.field_profile_picture.entity.fileuri) %}
{% endfor %}
-- Happy Coding

Tuesday, April 3, 2018

Detect MacBook by JavaScript

var isMac = navigator.platform.toUpperCase().indexOf('MAC')>=0;
 
  if ( isMac === true ) {
      $('css selector').css("line-height","150px");
  }

Friday, February 9, 2018

Session permission problem fix in Codeigniter

Follow the below steps:
1. Go to your application folder and create a folder named 'tmp'
2. Go to your config.php file and change the following lines:
$config['sess_driver'] = 'files';
$config['sess_cookie_name'] = 'ci_session';
$config['sess_expiration'] = 7200;
$config['sess_save_path'] = APPPATH . 'tmp';
$config['sess_match_ip'] = FALSE;
$config['sess_time_to_update'] = 300;
$config['sess_regenerate_destroy'] = FALSE;

You are done.

Tuesday, January 30, 2018

Install LAMP stack on linux(UBUNTU)

There are 5 to 6 commands are giving below to install LAMP stack on your ubuntu 16.04 machine:
1. sudo apt-get update

2. sudo apt-get install apache2

3. sudo apt-get install php5
    - if you get any problem with php5 then add ppa and you are good to go
    - for ppa follow below command

    - sudo add-apt-repository ppa:ondrej/php then run sudo apt-get update
    - then sudo apt-get install php5.6
    - then install some php modules by this command sudo apt-get install php5.6-mbstring php5.6-mcrypt php5.6-mysql php5.6-xml

4. sudo apt-get install mysql-server

5. sudo apt-get install phpmyadmin
    - for phpmyadmin you will have to add the below line at the very last in apache.conf file
    - Include /etc/phpmyadmin/apache.conf
    - sudo gedit /etc/apache2/apache2.conf in this file

6. restart apache by this command sudo /etc/init.d/apache2 restart

Wednesday, January 24, 2018

Lost windows 10 menu item from dual boot with ubuntu

You can do that with one command simply in ubuntu:
sudo update grub


*it will bring your windows 10 menu in boot menu

Workflow of WordPress project in a team with Git

1. We should not push any Wordpress core folders or files to github. 2. Only push custom theme and custom plugin into github. 3. So, in this...