Tuesday, September 10, 2013

Zoo CSV Import - Assign fields automatically

Zoo is Joomla's one of the best CCK extension. It's flexible and powerful content application builder to manage your content. Zoo allows to import data in JASON or CSV format. Data import done in following 3 stages.
1) Upload CSV file.

2) Select delimiters.Type in the field separator and the field enclosure of the CSV file.

3) Assign the submission fields to the appropriate CSV files columns. Here you have to assign the data in your CSV file to an item type of the app.
1st & 2nd stage of data importing is very easy & straight forward where as 3rd stage will be depends on how many submission fields you have map to the appropriate CSV files columns. Its fine, if you have to map 4-5 fields but what if you wanna map 20-30 fields & you want to upload large data. This stage kills you. Here we have solution for you. You just have to override administrator/components/com_zoo/views/configuration/tmpl/importcsv.php file. Add a Auto Map button & some script on click of Auto Map button in the file. That's it. Lets add the button first. Put this code anywhere you want to see the Auto Map button on page.

Add the following Jquery script.
 
  $("#automap").click(function(){
  
    
    $("li.assign").each(function(){
      
      var catname = $(this).find("span.name").text();
           
      
      
      if($(this).find('select.assign option').filter(function () { return $(this).html().toLowerCase() == catname.toLowerCase(); }).val()){
       $(this).find('select.assign option').filter(function () { return $(this).html().toLowerCase() == catname.toLowerCase(); }).attr("selected","selected");
       //$(this).find('select.assign').css("border", "1px solid green");
      }else{
       $(this).find('select.assign option').each(function(){
         var crval = $(this).text().toLowerCase();
         catname = catname.toLowerCase();
         //console.log(crval.split(catname).length);
         
         if(crval.split(catname).length > 1 ){
           $(this).attr("selected","selected");
           $(this).closest("select.assign").css("border", "1px solid red");
           
         }else if(catname.split(crval).length > 1){
           $(this).attr("selected","selected");
           $(this).closest("select.assign").css("border", "1px solid red");
         }
       })
       
      }
      
    });
   
   
  });