Error: popap html with Jquery

Question

Error: popap html with Jquery

Navigation

#1 by (0 votes)

0

I have an error calling a popap using Jquery:

1. HTML Code Button

<button type="button" class="btn btn-primary" id="btnAddCentrocosto" value="AddCentrocosto" onclick="$parent.openAddCentrocosto">Agregar Centro Costos</button>

2. Popap HTML

<div class="panel-heading" id="dialogAddCentrocosto" title="Centro de Costos..."> 
        <table>          
            <tr>
                <td><label>Costo : </label></td>
                <td><input type="text" id="nCosto" /></td>
            </tr>
            <tr>
                <td><label>Observaciones : </label></td>
                <td><textarea rows="5" id="strObservacionDistribucion"   class="form-control" name="strObservacionDistribucion"></textarea></td>    
            </tr>

        </table>
</div>

3. Jquery

self.openAddCentrocosto = function () {
            tr = jQuery('#btnAddCentrocosto').parent().parent();
            jQuery('#Distribucion').val(jQuery('td[data-bind="text: Distribucion"]', tr).text()); 
            jQuery('#nCosto').val('');
            jQuery('#nImpuestoDistribucion').val('18');
            //jQuery('#nTotalDistribucion').val('');
            jQuery('#dialogAddCentrocosto').dialog('open');
        }

4. Error message When clicking on the button I should raise the popap, but it is not done and it shows me the following error message:

Uncaught ReferenceError: $parent is not defined
    at HTMLButtonElement.onclick

Please, if someone can help me with this error, thank you very much.

jquery html5 knockoutjs asp.net jquery-ui

asked by DAES 17.09.2017 в 08:29

source

1 answer

Appropriate way to login to a web page from an android application? Error running facebook sdk

score 0 · Accepted Answer

You have an error line, call the function without $ parent and make sure you initialize the dialog :

jQuery('#Distribucion').val(jQuery('td[data-bind="text: //comentala

Solution

<html>
<head>
	<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
	<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
	<link rel="stylesheet" type="text/css" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"/>
	<script>
		$(function(){
			jQuery('#dialogAddCentrocosto').dialog({autoOpen: false,width:'auto'});
			
			self.openAddCentrocosto = function () {
	            tr = jQuery('#btnAddCentrocosto').parent().parent();
	            //jQuery('#Distribucion').val(jQuery('td[data-bind="text: 
	            jQuery('#nCosto').val('');
	            jQuery('#nImpuestoDistribucion').val('18');
	            //jQuery('#nTotalDistribucion').val('');
	            jQuery('#dialogAddCentrocosto').dialog('open');
	        }
        });		
	</script>
</head>
<body>
	<button type="button" class="btn btn-primary" id="btnAddCentrocosto" value="AddCentrocosto" onclick="openAddCentrocosto()">Agregar Centro Costos</button>
	<div class="panel-heading" id="dialogAddCentrocosto" title="Centro de Costos..."> 
        <table>          
            <tr>
                <td><label>Costo : </label></td>
                <td><input type="text" id="nCosto" /></td>
            </tr>
            <tr>
                <td><label>Observaciones : </label></td>
                <td><textarea rows="5" id="strObservacionDistribucion"   class="form-control" name="strObservacionDistribucion"></textarea></td>    
            </tr>

        </table>
	</div>
</body>
</html>