Pass the data in the Bootstrap Modal

Hi, I’m trying to pass the data in the Modal. So when I click the button it will get the post names of the form then go through ajax to pass the data. Here’s my controller:

public function getPatientRecords(){
		$valuedID =  $_POST['allpatientID'];
		echo json_encode ($valuedID);
		
	}

The Ajax Code:

function calAllRecords(){
	$.ajax({
		type: "post",
		url: "http://ospar.hostzi.com/authorized/getPatientRecords",
		cache: false,				
		data: $('#getAllRecords').serialize(),
		success: function(json){						
		try{		
			var obj = jQuery.parseJSON(json);
			$("#allpatient").modal("show")
					
			
		}catch(e) {		
			alert('Exception while request..');
		}		
		},
		error: function(){						
			alert('Error while request..');
		}
 });
}

This is my view where the values of my id is hidden in the input fields:

    if( !empty($allpatient) ) {
    		foreach($allpatient as $row){
    echo '<form role="form" id="getAllRecords" action="http://ospar.hostzi.com/authorized/getPatientRecords">';
    			echo '<input type="hidden" name="allpatientID" value="'.$row->ID.'">';
    			echo '<td><p type="button" class="btn btn-info btn-lg" value="Submit" onclick="javascript:calAllRecords();">Open</p></td>';
	}
}

Now when I click the button, I want the value to show in the modal so this is my modal body:

echo '<div class="modal-body">';
			echo '<div class="table-responsive">';
			echo '<table class="table table-bordered">';
			echo '<tbody>';
			echo '<tr>';
			echo '<th scope="row">Firstname: </th>' . '<td>'. $valuedID .'</td>';
			echo '</tr>';
			echo '</tbody>';
			echo '</table>';
			echo '</div>';
			echo '<p>Some text in the modal.</p>';
			echo '</div>';

but I’m getting an error of:

Message: Undefined variable: valuedID

Please help me. Thanks :smile:

I am thinking of appending the data in the modal body but I can’t just get the logic of it. :disappointed_relieved:

I did this:

function calAllRecords(){
	$.ajax({
		type: "post",
		url: "http://ospar.hostzi.com/authorized/getPatientRecords",
		cache: false,				
		data: $('#getAllRecords').serialize(),
		success: function(json){						
		try{		
			var obj = jQuery.parseJSON(json);
			alert( obj['valuedID']);
					
			
		}catch(e) {		
			alert('Exception while request..');
		}		
		},
		error: function(){						
			alert('Error while request..');
		}
 });
}

But it says undefined?

I have run into this before.
http://ospar.hostzi.com/authorized/getPatientRecords will need some javaScript since it is in the modal.

On the non ajax page, you cannot manipulate data in the modal that is called via ajax, if there is a way I would like to know.

Even though #allpatient is on the main, non ajax page, it is displaying remote content.
If you need the ID in getPatientRecords, pass it as a querystring.

http://ospar.hostzi.com/authorized/getPatientRecord?id=<?=$valuedID?>

That’s the best I can come up with.

I found the book “Pro PHP and jQuery” by Jason Lengstorf, published by Apress, helpful for leaning to work with php and modals. The ISBN number is 978-1-4302-2848-6

I got mine used on Amazon.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.