如何使用表中的上下文菜单打开新选项卡

Question

I am using a datatable to show some data and using context menu to navigate to another page from the datatable.But the problem is that when i am clicking the context menu tab the new window is opening in the same tab.but i need to open it in another tab,but it is not happening.I am giving the code ..

<script type="text/javascript" class="showcase">
            $(function() {
                var selectedVal;
                $.contextMenu({
                    selector : '.context-menu-one',
                    callback : function(key, options) {
                        var row = options.$trigger;
                        var newUrl = key;

                        if (key === 'calllist.do') {
                            var rows = row.find("td").eq(2).html();
                            actionUrl = '?' + 'a_no='
                                    + rows.toLocaleString();
                        }
                        if (key === 'travel') {
                            var rows = row.find("td").eq(3).html();
                            actionUrl = '?' + 'a_no='
                                    + rows.toLocaleString();
                        }
                        if (key === 'call_usage') {
                            var rows = row.find("td").eq(3).html();
                            actionUrl = '?' + 'a_no='
                                    + rows.toLocaleString();
                        }
                        if (key === 'network_analysis') {
                            var rows = row.find("td").eq(3).html();
                            actionUrl = '?' + 'a_no='
                                    + rows.toLocaleString();
                        }
                        if (key === 'location_analysis.do') {
                            var rows = row.find("td").eq(3).html();
                            actionUrl = '?' + 'a_no='
                                    + rows.toLocaleString();
                        }

                        if (key === 'location_tracker.do') {
                            var rows = row.find("td").eq(3).html();
                            actionUrl = '?' + 'a_no='
                                    + rows.toLocaleString();
                        }

                        if (key === 'personal') {
                            var rows = row.find("td").eq(1).html();
                            actionUrl = '?' + 'a_no='
                                    + rows.toLocaleString();
                            //  alert(actionUrl);

                        }

                        if (key === 'newsim.do') {
                            var rows = row.find("td").eq(5).html();
                            actionUrl = '?' + 'a_no='
                                    + rows.toLocaleString();
                            //  alert(actionUrl);

                        }

                        if (key === 'analyzecallingno') {
                            var rows = row.find("td").eq(2).html();
                            actionUrl = '?' + 'a_no='
                                    + rows.toLocaleString();


                        }

                        if (key === 'simdensity.do') {
                            var rows = row.find("td").eq(5).html();
                            actionUrl = '?' + 'a_no='
                                    + rows.toLocaleString();


                        }

                        document.forms[0].action = newUrl + actionUrl;
                        document.forms[0].submit();
                    },
                    items : {

                        "analyzecallingno" : {
                            name : "Analyze Calling Number"
                        },
                        "travel": {
                            name : "Analyze Caller Tower"
                        },
                        "network_analysis" : {
                            name : "Social Network Analysis"
                        },
                        "call_usage" : {
                            name : "Call Analysis Summary"
                        },
                        "location_tracker.do" : {
                            name : "Location Tracking"
                        },
                        "personal" : {
                            name : "Caller Personal Details"
                        }

                    }
                });
            });
        </script>

        <table class="tableData context-menu-one" id="tableData"
            style="overflow-x: scroll">
            <thead>
                <tr style="font-size: 14px;">
                    <th align="left">CALLTYPE</th>
                    <th align="left">CALLER</th>
                    <th align="left">CALLEE</th>
                    <th align="left">DURATION</th>
                    <th align="left">START DATE</th>
                    <th align="left">END DATE</th>
                    <th align="left">FROM LOC</th>
                    <th align="left">TO LOC</th>
                    <th align="left">IMEI</th>
                    <th align="left">IMSI</th>
                </tr>
            </thead>
            <tbody>
                <c:forEach items="${searchpage}" var="listofvalues">
                    <tr class="context-menu-one notfirst" style="font-size: 12px;">
                        <td align="left"><c:out value="${listofvalues.call_type}" /></td>
                        <td align="left"><c:out value="${listofvalues.a_no}" /></td>
                        <td align="left"><c:out value="${listofvalues.b_no}" /></td>
                        <td align="left"><c:out
                                value="${listofvalues.call_duration}" /></td>
                        <td align="left"><c:out value="${listofvalues.start_day}" /></td>
                        <td align="left"><c:out value="${listofvalues.end_day}" /></td>
                        <td align="left"><c:out
                                value="${listofvalues.a_home_circle}" /></td>
                        <td align="left"><c:out
                                value="${listofvalues.a_rome_circle}" /></td>
                        <td align="left"><c:out value="${listofvalues.a_imei}" /></td>
                        <td align="left"><c:out value="${listofvalues.a_imsi}" /></td>

                    </tr>
                </c:forEach>
            </tbody>
        </table>
    </div>
</div>

Answer 1

Maybe you could use something like $("form:first").attr('target', '_blank').submit(); instead of document.forms[0].action = newUrl + actionUrl; .

ps. don't forget to set your action URL:

$("form:first").attr({
                      'target':'_blank',
                      'action':newUrl + actionUrl
                    }).submit();

You could also use $( "form" ).first().attr.... .