插入多个复选框值php ajax

Question

Please help me, This matter ruined my days . I tried with ajax and php, post these codes in previous thread, but can't get answer or any guide. I think my question or code are unclear. So here I Post what I actually need. Please help me or provide any links that helps.

HTML. It is dynamic and would be generated from php

<li>
<input type="checkbox" name="menu[]" value="News">News
    <ul>
        <li>
        <input type="checkbox" name="menu[][]" value="politics">Politics
        </li>
        <li>
        <input type="checkbox" name="menu[][]" value="Social">Social
        </li>
    </ul>
</li>
<li>
<input type="checkbox" name="menu[]" value="Views">Views                                 
</li>
<li>
<input type="checkbox" name="menu[]" value="Art">Art                               
</li>

<form>
</form>

While inserting multiple values it should be inserted as follow. If each menu has subcategory, then each checked value would be inserted in subcat_id, if has not then Null value.

What I tried :

Ajax

$(document).on('submit', '#form', function(e){
    e.preventDefault();
    var navid = [];
        $("input[name='menu[]']:checked").each(function(){
            navid.push(this.value);
        });
    var subnavid = [];
        $("input[name='menu[][]']:checked").each(function(){
            subnavid.push(this.value);
        });
        var formData = new FormData(this);
        formData.append('navid', navid);
        formData.append('subnavid', subnavid);
            $.ajax({
                type: 'POST',
                url: 'upload.php',
                data: formData,
                contentType: false,
                cache: false,
                processData:false,
                success: function(data){
                    alert(data);
                }
            });
      });

PHP

$data = explode("," ,$_POST["navid"]); 
subdata = explode("," ,$_POST["subnavid"]);
foreach ($data AS $key => $menu){
   foreach($subdata AS $k => $submenu){
   ......
   ......
   }
}