[denitriyandi]

Hi everyone...

 

I'm nob's here with groceryCRUD, just try with instalation then, crud functionality... but i have an idea, when i click add button it's replace to new page, but my idea can i do add/ insert new data without new page, i mean like this (attach files):

 

just add form without change to another pages.

 

 

Thanks a million for your help.

 

DenTr

 

 

[Amit Shah]

Well .. it seems like you looking to achive more of a sort of inline edit. Your idea may be a great deal but that is not sufficient / requirement for everyone - why cuz a form may have much more to capture then u could display in the list.. hence there is no limiting / restricting the same in here.

 

And as for your idea - the source is open - you can very well apply / adher to the solutuion you desire to get in action with. 

Well something that might suite your requirement better then grocerycrud in here as you demonstrate will be using jqgrid.. that will give u a lot more functional flexibility as u desire in the diagram but then the catch there - u have to do a lot of server side coding.. so choice always is yours - live with grocerycrud or go to jqgrid

 

as far as a solution possible with your requirement can be like.. on click of add - open the add form as a popup in the window..

use the following workaround stuff to generate make a javascript call post insert was successfull that can make the grid go refresh and close the current window.

That way you wont have a need to leave the window and yet your requirement will be filled up with. But here - you have to workaround dealing in with writing up the javascript stuff..

 

Hope you reach up to your desired requirement with the wild idea shared.

 

Happy GCing :)

[titu]

Also you may use the iframe aproach on a modal. Adding an action button which triggers this event:

$(".editItem").click(function(){
     $('#editFrame').attr('src',"/acobrar/index/edit/"+$(this).data('id'));
     $('#modEdit').modal({show:true});

});

On click on the edit button of the row with attribute id the following modal will popup:

<div class="modal fade" id="modEdit" tabindex="-1" role="basic" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">

<div class="modal-body">
<iframe id='editFrame' src="" style="zoom:0.60" width="99.6%" height="800" frameborder="0"></iframe>
</div>

</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>

In this way the iframe src changes dinamically and with the modal you don't have to get out of the main page.

 

I know these may be an awful approach regarding loading times and iframe usually aren't a good approach but it made me deliver the product.

 

[Amit Shah]

yup - at times ... awful things gives in better then existing results :)

[denitriyandi]

yup - at times ... awful things gives in better then existing results :)

 

Well .. it seems like you looking to achive more of a sort of inline edit. Your idea may be a great deal but that is not sufficient / requirement for everyone - why cuz a form may have much more to capture then u could display in the list.. hence there is no limiting / restricting the same in here.

 

And as for your idea - the source is open - you can very well apply / adher to the solutuion you desire to get in action with. 

Well something that might suite your requirement better then grocerycrud in here as you demonstrate will be using jqgrid.. that will give u a lot more functional flexibility as u desire in the diagram but then the catch there - u have to do a lot of server side coding.. so choice always is yours - live with grocerycrud or go to jqgrid

 

as far as a solution possible with your requirement can be like.. on click of add - open the add form as a popup in the window..

use the following workaround stuff to generate make a javascript call post insert was successfull that can make the grid go refresh and close the current window.

That way you wont have a need to leave the window and yet your requirement will be filled up with. But here - you have to workaround dealing in with writing up the javascript stuff..

 

Hope you reach up to your desired requirement with the wild idea shared.

 

Happy GCing :)

Yups, i extended grocery to solve extra view... thanx for your reply.

[denitriyandi]

 

Also you may use the iframe aproach on a modal. Adding an action button which triggers this event:

$(".editItem").click(function(){
     $('#editFrame').attr('src',"/acobrar/index/edit/"+$(this).data('id'));
     $('#modEdit').modal({show:true});

});

On click on the edit button of the row with attribute id the following modal will popup:

<div class="modal fade" id="modEdit" tabindex="-1" role="basic" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">

<div class="modal-body">
<iframe id='editFrame' src="" style="zoom:0.60" width="99.6%" height="800" frameborder="0"></iframe>
</div>

</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>

In this way the iframe src changes dinamically and with the modal you don't have to get out of the main page.

 

I know these may be an awful approach regarding loading times and iframe usually aren't a good approach but it made me deliver the product.

 

 

 

it's good approach.. thanks btw. i just need some add form in same page with view/ list of data. :D

[Noel Calonia]

@titu i have a problem, in 

$(".editBtn").click(function(){
    $('#editFrame').attr('src',"/acobrar/index/edit/"+$(this).data('id'));
});

the 

$(this).data('id');

seems not returning value of the id where i want to edit or view the selected data. please answer my question ASAP, infinite thanks in advance.  :)

and additional question, i am using a bootstrap theme, i just want to remove the menu, header, etc., i just want to display the add record div in the modal, better look at the pic below to get what i really mean.

 

 

[titu]

I'm not using GC for listing so on my plugin I can add action in my way. I guess a workaround for you is :

$(".editBtn").click(function(e){
        $('#editFrame').attr('src',$(this).attr('href'));
        $('#modEdit').modal({show:true});
        e.preventDefault();
});

Regarding header and footer I set a boolean on controller :

$output->showHeader= false;
$output->showFooter= false;
 

And do the correct modification on the view.

[Noel Calonia]

@titu i try the code but there is a problem in 

$('#editFrame').attr('src',$(this).attr('href'));

it seems like it's redirecting to my table inside the iframe. when i look at the chrome's firebug, in the url, it doesn't give a value to the "id" to be edited and viewed.

 

ex: 

dev.example.com/InfoTable/edit/undefined

also as the view using this code that you replied on one of the topics here: 

$(".editBtn").click(function (e) {
    $('#editFrame').attr('src',"/InfoTable/edit/"+$(this).data('resident_id'));
    e.preventDefault();
});

btw, i get rid of the removal of header and footer inside the modal by making new .php file as a view file for crud operations(add,edit,view.delete) with generating js and css inside the my crud controller.

[titu]

This is the add or edit action button? What href does the button have?

[Noel Calonia]

@titu it is the edit button, when click it will go to edit section of grocery crud.....
btw, i solve this by doing json_encode the links(Ex: <?php echo json_encode($row->edit_url);?>) generated in the /list,php and put in a variable then put it in the button; then it will open a modal that will project the crud operations(add,edit,view) inside iframe tag. Thanks for the ideas @titu, kudos!  :)