I want to create a woocommerce form in which the field will be something like this Name ________ email__________ Categories __________ product__________ Note_______ Submit*

code is

<form class="well form-horizontal" action=" " method="post"  id="contact_form">
<fieldset>

<!-- Form Name -->
<legend>Please Fill It</legend>

<!-- Text input-->

<div class="form-group">
  <label class="col-md-4 control-label">First Name</label>  
  <div class="col-md-4 inputGroupContainer">
  <div class="input-group">
  <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
  <input  name="first_name" placeholder="First Name" class="form-control"  type="text">
    </div>
  </div>
</div>

<!-- Text input-->

<div class="form-group">
  <label class="col-md-4 control-label" >Last Name</label> 
    <div class="col-md-4 inputGroupContainer">
    <div class="input-group">
  <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
  <input name="last_name" placeholder="Last Name" class="form-control"  type="text">
    </div>
  </div>
</div>


<!-- Select Basic -->

<div class="form-group"> 
  <label class="col-md-4 control-label">Services</label>
    <div class="col-md-4 selectContainer">
    <div class="input-group">
        <span class="input-group-addon"><i class="glyphicon glyphicon-list"></i></span>
    <select name="service" id="service" class="form-control selectpicker" >
        <option value=" " >Please select service category</option>
        <?php

  $taxonomy     = 'product_cat';
  $orderby      = 'name';  
  $show_count   = 0;      // 1 for yes, 0 for no
  $pad_counts   = 0;      // 1 for yes, 0 for no
  $hierarchical = 1;      // 1 for yes, 0 for no  
  $title        = '';  
  $empty        = 0;

  $args = array(
         'taxonomy'     => $taxonomy,
         'orderby'      => $orderby,
         'show_count'   => $show_count,
         'pad_counts'   => $pad_counts,
         'hierarchical' => $hierarchical,
         'title_li'     => $title,
         'hide_empty'   => $empty
  );
 $all_categories = get_categories( $args );
 foreach ($all_categories as $cat) {
    if($cat->category_parent == 0) {
        $category_id = $cat->term_id;       
        echo '<br /><option value="'.$cat->name. '" >'. $cat->name .'</option>';


    }       
}
?>


</select>
    </div>
   </div>
</div>
<!-- Select Basic -->

<div class="form-group"> 
  <label class="col-md-4 control-label">Product</label>
    <div class="col-md-4 selectContainer">
    <div class="input-group">
        <span class="input-group-addon"><i class="glyphicon glyphicon-list"></i></span>
    <select name="product" id="product" class="form-control selectpicker" >
      <option value=" " >Please select service Product</option>


</select>
    </div>
   </div>
</div>

<!-- Text input-->

<div class="form-group">
  <label class="col-md-4 control-label">Project Description</label>
    <div class="col-md-4 inputGroupContainer">
    <div class="input-group">
        <span class="input-group-addon"><i class="glyphicon glyphicon-pencil"></i></span>
            <textarea class="form-control" name="comment" placeholder="Project Description"></textarea>
  </div>
  </div>
</div>

<!-- Success message -->
<div class="alert alert-success" role="alert" id="success_message">Success <i class="glyphicon glyphicon-thumbs-up"></i> Thanks for contacting us, we will get back to you shortly.</div>

<!-- Button -->
<div class="form-group">
  <label class="col-md-4 control-label"></label>
  <div class="col-md-4">
    <button type="submit" class="btn btn-warning" >Send <span class="glyphicon glyphicon-send"></span></button>
  </div>
</div>

</fieldset>
</form>
<script>
     $('#service').on('change',function(){

        var servicename = $(this).val();
        //alert(statename);
        if(servicename){
            $.ajax({
                type:'POST',
                url:'<?php echo bloginfo('url'); ?>/serviceajax/',
                data:'service_name='+servicename,
                datatype: 'JSON',
                async: false,
                success:function(result){
                    $('#product').html(result);

                }
            }); 
        }else{
            $('#product').html('<option value="">Select service First</option>'); 

        }
        return true;
    });
</script>

Now when the user selects the categories in the woocommerce, then we have added the categories in the wocommerce, it will be shown here And when the user selects the categories, then the products of that category will come in the field with the product. After filling the form, when the user submits it will reach the checkout page of the wocommerce with the product.