Значения массива PHP JSON в таблице HTML после обновления до API - PullRequest
0 голосов
/ 05 апреля 2019

Я работаю над обновлением записей JSON из таблицы HTML.

По сути, это работает так, что он извлекает данные json из api-URL-адреса - устанавливает их внутри таблицы - в последнем столбце таблицы. ПОРЯДОК НАСТРОЙКИ СОХРАНИТЬ - я нажимаю эту кнопку, и онаделает все TD из TR редактируемыми - снова нажмите кнопку SAVE и сохраните эту строку.Это только рабочая сторона клиента, как мы говорим.Мне нужно сделать эту работу, чтобы обновить серверную часть - возможно, также закодировать обратно в формат JSON из таблицы ROW - затем обновить эту конкретную запись с помощью API.

Код

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-json/2.6.0/jquery.json.min.js"></script>

<script>
    //Use jQuery to edit row
    $(document).ready(function(){
    $('.editbtn').click(function () {
    var currentTD = $(this).parents('tr').find('td');
    //alert('this '+$(this).html() );
        if ($(this).text().trim() == 'Edit') {
            currentTD = $(this).parents('tr').find($("td").not(":nth-child(7)"));
            //alert("first if "+currentTD.html());
            $.each(currentTD, function () {
                $(this).prop('contenteditable', true).css({
                'background':'#fff',
                'color':'#000'
                })
            });
        } else {
            // alert("second if "+currentTD.html());
            $.each(currentTD, function () {
            //alert("second if "+currentTD.html());
            $(this).prop('contenteditable', false).removeAttr("style");
            });
        }
        $(this).html($(this).html() == 'Edit' ? 'Save' : 'Edit')
        if ($(this).html() == 'Save'){
            // alert("third if "+currentTD.html());
            $(this).prop('contenteditable',false)
            }
        });
    });
</script>

<?php

    $url = 'URL';
    $data = file_get_contents($url);
    $parsed = json_decode($data, true);

    $eachEntry = $parsed['response']['result']['Leads']['row'];

    $valuesIWant = ["First Name", "Last Name", "Street", "City", "State", "Zip Code"];

    echo '<div class="uabb-table-module-content uabb-table">
            <div class="uabb-table-element-box">
                <div class="uabb-table-wrapper">
                    <table id="tableone" class="uabb-table-inner-wrap table table-striped table-dark table-bordered">
                        <thead class="uabb-table-header">
                            <tr class="table-header-tr">
                                <th class="table-heading-0 table-header-th" rowspan="" colspan="">
                                    <label class="head-style-0 th-style">
                                        <label class="head-inner-text">First Name</label>
                                    </label>
                                </th> 
                                <th class="table-heading-1 table-header-th" rowspan="" colspan="">
                                    <label class="head-style-1 th-style">
                                        <label class="head-inner-text">Last Name</label>
                                    </label>
                                </th> 
                                <th class="table-heading-2 table-header-th" rowspan="" colspan="">
                                    <label class="head-style-2 th-style">
                                        <label class="head-inner-text">Street</label>
                                    </label>
                                </th> 
                                <th class="table-heading-3 table-header-th" rowspan="" colspan="">
                                    <label class="head-style-3 th-style">
                                        <label class="head-inner-text">City</label>
                                    </label>
                                </th> 
                                <th class="table-heading-4 table-header-th" rowspan="" colspan="">
                                    <label class="head-style-4 th-style">
                                        <label class="head-inner-text">State</label>
                                    </label>
                                </th> 
                                <th class="table-heading-5 table-header-th" rowspan="" colspan="">
                                    <label class="head-style-5 th-style">
                                        <label class="head-inner-text">Zip Code</label>
                                    </label>
                                </th>
                                <th class="table-heading-5 table-header-th" rowspan="" colspan="">
                                    <label class="head-style-5 th-style">
                                        <label class="head-inner-text"></label>
                                    </label>
                                </th> 
                            </tr>
                        </thead>';

    foreach ($eachEntry as $entry) {

        $FL = $entry['no'];

        $entries = $entry['FL'];

        echo '<tbody class="uabb-table-features"><tr class="tbody-row">';

        foreach ($entries as $value) {

            $val = $value['val'];

            $content = $value['content'];

            if (in_array($val, $valuesIWant)) {

                //$out = $val;
                $out2 = $content;

                echo '<td class="table-body-td  table-body-0" colspan="" rowspan=""><span class="content-text">'. $out2 .'</span></td>';
            }
        }

        echo '<td contenteditable="false">
                <button type="button"class="btn btn-primary editbtn">Edit</button><!--<button type="button" class="btn btn-danger">Delete</button>--></td></tr></tbody>';
    }

    echo '</table></div></div></div>';

    $count = count($eachEntry);

    echo '<tbody class="uabb-table-features"><tr class="tbody-row"><span>There are '. $count .' records.</span></tr></tbody>';

?>

JSONСтруктура

{
    "response": {
        "result": {
            "Leads": {
                "row": [
                    {
                        "no": "1",
                        "FL": [
                            {
                                "val": "LEADID",
                                "content": "123000000596123"
                            },
                            {
                                "val": "SMOWNERID",
                                "content": "123000000291123"
                            },
                            {
                                "val": "Lead Owner",
                                "content": "Casar"
                            },
                            {
                                "val": "First Name",
                                "content": "Bob"
                            },
                            {
                                "val": "Last Name",
                                "content": "Something"
                            },
                            {
                                "val": "Email",
                                "content": "email@email.com"
                            },
                            {
                                "val": "Mobile",
                                "content": "1113332222"
                            },
                            {
                                "val": "SMCREATORID",
                                "content": "383590700000032132"
                            },
                            {
                                "val": "Created By",
                                "content": "Casar"
                            },
                            {
                                "val": "Created Time",
                                "content": "2019-04-03 15:14:05"
                            },
                            {
                                "val": "Modified Time",
                                "content": "2019-04-03 17:13:58"
                            },
                            {
                                "val": "Full Name",
                                "content": "Bob"
                            },
                            {
                                "val": "Street",
                                "content": "123 Fake Rd"
                            },
                            {
                                "val": "City",
                                "content": "Fakecity"
                            },
                            {
                                "val": "State",
                                "content": "DC"
                            },
                            {
                                "val": "Zip Code",
                                "content": "123123"
                            },
                            {
                                "val": "Email Opt Out",
                                "content": "false"
                            },
                            {
                                "val": "Salutation",
                                "content": "Mr."
                            },
                            {
                                "val": "Last Activity Time",
                                "content": "2019-04-03 17:13:58"
                            },
                            {
                                "val": "Tag",
                                "content": "convert"
                            },
                            {
                                "val": "Account Name",
                                "content": "Chief"
                            },
                            {
                                "val": "Territory Manager",
                                "content": "Mike"
                            },
                            {
                                "val": "Territory Manager_ID",
                                "content": "312390700000021111"
                            },
                            {
                                "val": "Classification",
                                "content": "Instal"
                            },
                            {
                                "val": "Area",
                                "content": "Zone 1"
                            },
                            {
                                "val": "Account Number",
                                "content": "2342342"
                            }
                        ]
                    }
                ]
            }
        },
        "uri": "/crm/private/json/Leads/getRecords"
    }
}

Это дополнительный вопрос от:

PHP JSON Декодирование в массив для захвата определенных ключевых значений (все поля с одинаковым именем)

PHP JSON для массива значений в таблицу HTML

1 Ответ

1 голос
/ 06 апреля 2019
$("#tableone").ediTable({
        button:{
             edit:{
                  active:true,  
              }
        }
        afterSave:function($values){
             formdata=new FormData();
             $.each(values,function(index,cellValue){
                  formdata.append(index,cellValue);
             });
             $.ajax({
                  url:"/path/serverFile[.extension]",
                  data:formdata,
                  type:"method",
                  success:function(resp){}
             });
        }
});

Примечание: вам нужно просто указать имя каждого поля в атрибуте "data-index" ваших TD

например:

   foreach ($entries as $value) {
        $val = $value['val'];

        $content = $value['content'];

        if (in_array($val, $valuesIWant)) {

            //$out = $val;
            $out2 = $content;

            echo '<td data-index="*NAME OF FIELD*" class="table-body-td  table-body-0" colspan="" rowspan=""><span class="content-text">'. $out2 .'</span></td>';
        }
    }

Ссылка на библиотеку: https://github.com/OxiGen1001/ediTable

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...