csv file upload progress bar in ruby on rails

Hi Guys,

I have added bootstrap progress bar when uploading csv file. 

Submit form using Ajax:-   
    <%= form_for @company, :url=>company_upload_path, :html => {multipart: true,:class=>"upload_form",:remote=>true,:id=>"new_company"} do |f| %>            
              <%= file_field_tag "file",:class=>"form-control btn btn-default",:id=>"model_file" %>
              <%= f.button 'Import', :class => 'submit  btn btn-primary import_button' %>
            <% end %>

Add progress-bar div when you want to show progress bar and give its initial width 0.


<div class="progress" id = "import-campaign-bar">
          <div  class="progress-bar progress-bar-success" style="width: 0%"></div>
</div>



def company_upload  

      # @company=Company.import_company(params[:company][:file], params[:tag],current_user,                                                                                                                                                            params[:campaign_id])
      # flash[:success] = "Companies Imported" if !@company.blank?
      # redirect_to :back

      companies = []  
      if !params[:company][:file].blank?
        CSV.foreach(params[:company][:file].tempfile,:encoding => 'windows-1251:utf-8') { |row|          
          company_data = {}      
          company_data["name"] = row[0]
          company_data["facebook"] = row[1]        
          company_data["phone"] = row[2]
              companies << company_data
        }
        #remove first row with column name and make a new array with companys
        companies = companies[1..companies.length]
      end
        @total_count = companies.count
        if params[:count].blank?
          @count = 0
        else
          @count = params[:count].to_i + 1
        end
     
        if !companies[@count].blank?          
       
            @company = current_user.companies.create(companies[@count])
            @company.user_id=current_user.id
            @company.campaign_id = campaign_id
            @company.set_tag_list_on(:company_tags,tag)              
            @company.save
            @activity = import_company_activity_create(@company.id,campaign_id,current_user)


      end
  end

create company_upload.js.erb and add following lines:-


<% if @count < @total_count %>
    <% bar_value = 100.to_f / @total_count.to_f %>
    <% progress_width = (@count+1)*bar_value %>
    $("#import_count").remove()
    $("#new_company").append("<input type='text' id='import_count' class = 'hidden' name='count' value =<%= @count %>>")
    $("#new_company").submit()
    $("#import-company-bar .progress-bar").css("width","<%=progress_width%>%")
<% else %>
     $('span').hide();
     $('.imported').show();
<% end %>

Comments