Ajax entegre - Edit in place jquery

Web sayfalarında sıkça kullanılan javascript dili hakkında konular, hazır scriptler.
Cevapla
Özgür
Deneyimli Üye
Deneyimli Üye
Mesajlar: 351
Kayıt: 16 Şub 2009, 01:16

Ajax entegre - Edit in place jquery

Mesaj gönderen Özgür » 28 Ara 2013, 19:21

Kod: Tümünü seç

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta name="author" content="Vitaliy Potapov">
        <meta http-equiv="cache-control" content="max-age=0" />
        <meta http-equiv="cache-control" content="no-cache" />
        <meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
        <meta http-equiv="pragma" content="no-cache" />

        <title>X-editable Demo</title>

        <script src="assets/jquery/jquery-1.9.1.min.js"></script>  
        <script src="assets/mockjax/jquery.mockjax.js"></script>
        
        <!-- momentjs --> 
        <script src="assets/momentjs/moment.min.js"></script> 
        
        <!-- select2 --> 
        <link href="assets/select2/select2.css" rel="stylesheet">
        <script src="assets/select2/select2.js"></script>         

        <!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
        <!--[if lt IE 9]>
        <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]--> 
        
         
        <!-- bootstrap 3 -->
        <link href="assets/bootstrap300/css/bootstrap.css" rel="stylesheet">
        <script src="assets/bootstrap300/js/bootstrap.js"></script>

        <!-- bootstrap-datetimepicker -->
        <link href="assets/bootstrap-datetimepicker/css/datetimepicker.css" rel="stylesheet">
        <script src="assets/bootstrap-datetimepicker/js/bootstrap-datetimepicker.js"></script>        
        
        <!-- x-editable (bootstrap 3) -->
        <link href="assets/x-editable/bootstrap3-editable/css/bootstrap-editable.css" rel="stylesheet">
        <script src="assets/x-editable/bootstrap3-editable/js/bootstrap-editable.js"></script>

        <!-- select2 bootstrap -->
        <link href="assets/select2/select2-bootstrap.css" rel="stylesheet">
       
        <!-- typeaheadjs -->
        <link href="assets/x-editable/inputs-ext/typeaheadjs/lib/typeahead.js-bootstrap.css" rel="stylesheet">
        <script src="assets/x-editable/inputs-ext/typeaheadjs/lib/typeahead.js"></script>         
        <script src="assets/x-editable/inputs-ext/typeaheadjs/typeaheadjs.js"></script>         
        
        <link href="assets/demo-bs3.css" rel="stylesheet">
        
        <style type="text/css">       
            #comments:hover {
                background-color: #FFFFC0;
                cursor: text; 
            }
        </style>
        
        <script>
        var f = 'bootstrap3';
        </script>

        
        <!-- address input -->
        <link href="assets/x-editable/inputs-ext/address/address.css" rel="stylesheet">
        <script src="assets/x-editable/inputs-ext/address/address.js"></script> 
        
        <script>
            var c = window.location.href.match(/c=inline/i) ? 'inline' : 'popup';
            $.fn.editable.defaults.mode = c === 'inline' ? 'inline' : 'popup';

            $(function(){
                $('#f').val(f);
                $('#c').val(c);
                
                $('#frm').submit(function(){
                    var f = $('#f').val();
                    if(f === 'jqueryui') {
                        $(this).attr('action', 'demo-jqueryui.html');
                    } else if(f === 'plain') {
                        $(this).attr('action', 'demo-plain.html');
                    } else if(f === 'bootstrap2') {
                        $(this).attr('action', 'demo.html');
                    } else {
                        $(this).attr('action', 'demo-bs3.html');                        
                    }
                });
            });
        </script>        
                
        <style type="text/css">
            body {
                padding-top: 50px;
                padding-bottom: 30px;
            }
            
            table.table > tbody > tr > td {
                height: 30px;
                vertical-align: middle;
            }
        </style>         

    </head>

    <body> 

        <div style="width: 80%; margin: auto;"> 
            
            

            
            <table id="user" class="table table-bordered table-striped" style="clear: both">
                <tbody> 
                    <tr>         
                        <td width="35%">Simple text field</td>
                        <td width="65%"><a href="#" id="username" data-type="text" data-pk="1" data-title="Enter username">superuser</a></td>
                    </tr>
                    <tr>         
                        <td>Empty text field, required</td>
                        <td><a href="#" id="firstname" data-type="text" data-pk="1" data-placement="right" data-placeholder="Required" data-title="Enter your firstname"></a></td>
                    </tr>  
                </tbody>
            </table>
            
            <div style="float: left; width: 50%">
              <h3>Console <small>(all ajax requests here are emulated)</small></h3> 
                <div><textarea id="console" class="form-control" rows="8" style="width: 70%" autocomplete="off"></textarea>
                </div>
            </div>
        </div>        
        <script src="assets/demo-mock.js"></script> 
        <script src="assets/demo.js"></script>         
        
    </body>
</html>
Edit in place jquery fonksiyonu buldum internetten (yukardaki sayfa). Çalıştırdım verileri ekranda gösteriyor, firstname ve username değerini alıyorum. Bu iki değeri nasıl işlem sayfasına yazdırabilirim?

Özgür
Deneyimli Üye
Deneyimli Üye
Mesajlar: 351
Kayıt: 16 Şub 2009, 01:16

Re: Ajax entegre - Edit in place jquery

Mesaj gönderen Özgür » 28 Ara 2013, 19:25

muhtemelen demo.js içinde islem sayfasına giden bir url tanımlanmıştır. Tüm sayfaları göndermemişsin.

Özgür
Deneyimli Üye
Deneyimli Üye
Mesajlar: 351
Kayıt: 16 Şub 2009, 01:16

Re: Ajax entegre - Edit in place jquery

Mesaj gönderen Özgür » 28 Ara 2013, 19:32

maillist.php'de

Kod: Tümünü seç

url: '/post',
diye bir satır var. Değiştirdim olmadı. yani

Kod: Tümünü seç

 url:'islem_maillist_ekle.php',
yazdım çalıştırmadı.

Özgür
Deneyimli Üye
Deneyimli Üye
Mesajlar: 351
Kayıt: 16 Şub 2009, 01:16

Re: Ajax entegre - Edit in place jquery

Mesaj gönderen Özgür » 03 Oca 2014, 16:38

tmm. Problem yok, url yazım hatasıymış.

Özgür
Deneyimli Üye
Deneyimli Üye
Mesajlar: 351
Kayıt: 16 Şub 2009, 01:16

Re: Ajax entegre - Edit in place jquery

Mesaj gönderen Özgür » 06 Oca 2014, 19:02

Uygulamayı başarılı bir şekilde gerçekleştirdim. Konu kapanmıştır.

Cevapla

Kimler çevrimiçi

Bu forumu görüntüleyen kullanıcılar: Hiç bir kayıtlı kullanıcı yok ve 2 misafir