将id从json传递到js，弹出一个对话框 - passing id from json to js to a dialog pop up

我正在使用jquery UI对话框在FullCalendar EventClick上显示更多数据我可以将所有信息发送到对话框I除了我需要发送id并将其添加到类似的链接之外

<a href='editsigning1.php?id="id"'>Edit Signing</a>

我不知道如何做到这一点，我不知道该发送什么url，因为我不知道在查看所有其他数据后点击事件并转到我选择的页面。

除了id 通过之外，一切都正常

这是js文件

// Setup FullCalendar
(function () {
    var date = new Date();
    var d = date.getDate();
    var m = date.getMonth();
    var y = date.getFullYear();

    $('#fullcalendar').fullCalendar({
        editable: true,
        //height: 500,
        header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,agendaWeek,agendaDay'
            },
        eventClick: function (calEvent, jsEvent, view) {
            $("#dialog").dialog({
                autoOpen: false,
                height: 300,
                width: 500,
            }
            );
            $("#start").val(calEvent.start);
            $("#title").val(calEvent.title);
            $("#address").val(calEvent.address);
            $("#id").val(calEvent.id);
            $("#hphone").val(calEvent.hphone);
            $("#cphone").val(calEvent.cphone);
            $("#wphone").val(calEvent.wphone);
            $("#email").val(calEvent.email);
            $('#dialog').dialog('open');
        },
        events: "json_events.php", 
    });
}());

这是弹出的对话框信息

<div id="fullcalendar"></div>
<div id="dialog" title="My Signing" style="display:none">
    <form>
            <input type="text" name="start" id="start" class="form-control input-sm">

            <input type="text" name="title" id="title" class="form-control input-sm">
            <input type="text" name="address" id="address" class="form-control input-sm">
            <input type="text" name="hphone" id="hphone" class="form-control input-sm">
            <input type="text" name="cphone" id="cphone" class="form-control input-sm">
            <input type="text" name="wphone" id="wphone" class="form-control input-sm">
            <input type="text" name="email" id="email" class="form-control input-sm">
            <input type="text" name="edit" id="edit">
           <a href='editsigning1.php?id="id"'>Edit Signing</a>

    </form>
</div>

这是创建json_events.php 的代码

$events = array();
foreach($db->query("SELECT * FROM `signings` WHERE `pid` = '$pid' AND `done`= 0") as $row) {
    $title = $row['fname'].' '.$row['lname'] . ' ' . $row['coname'];
    $eventsArray['id'] =  $row['id'];
    $eventsArray['ordern'] =  $row['ordern'];
    $eventsArray['title'] = $title;
    //$eventsArray['url'] = "editsigning1.php?id=" . $row['id'];
    $eventsArray['start'] = $row['signstart'];
    $eventsArray['end'] = $row['signend'];
    $eventsArray['stop'] = $row['signend'];
    $eventsArray['address'] = $row['street1'] . ' ' . $row['street2'] . ' ' . $row['city'] . ', ' . $row['state'] . ', ' . $row['zip'];
    $eventsArray['hphone'] = 'Home Phone ' . $row['hphone'];
    $eventsArray['cphone'] = 'Cell Phone ' . $row['cphone'];
    $eventsArray['wphone'] = 'Work Phone ' . $row['wphone'];
    $eventsArray['email'] = $row['email'];
    $eventsArray['allDay'] = "";
    $eventsArray['color'] = "#04488B";
    $eventsArray['textColor'] = "#FFFFFF";
    $events[] = $eventsArray;
}

echo json_encode($events);

让我为您分解一下。。。

您为链接提供的HTML可以更改为：

<a href="editsigning1.php?id={id}" id="linkId">Edit Signing</a>

通过这种方式，您可以访问$("#linkId")而不是$("#id")。

现在，您不需要更改值，只需要更改属性。

$("#linkId").prop('href', calEvent.id);

由于您需要更改字符串中的特定字符串，我使用了大括号{id}，因此现在可以替换它，而不是整个属性。

$("#linkId").prop('href', $("#linkId").prop('href').replace('{id}', calEvent.id));

我认为这应该奏效。

更新：

如果您需要在HTML输出中打印数据：

<div id="start" class="popupData"></div>

然后在jQuery中使用text（）：

$("#start").text(calEvent.start)

您还可以在data响应对象上循环以动态添加HTML输出：

var arr = [];
for (var prop in calEvent){
    if (calEvent.hasOwnProperty(prop)){
        arr.push('<input class="popupData" id="'+prop+'" value="'+calEvent[prop]+'" placeholder="'+prop+'" />');
        //arr.push('<div class="popupData">' + calEvent[prop] + '</div>');
    }
}
$("#dialog").find("form").prepend(arr);

这样，您就不需要为每个属性添加HTML。

标记：

这些div的标记应该放在CSS中。考虑给div一个class或直接在id 上

#dialog #start,
#dialog div.popupData { padding: 5px; border-bottom: 1px solid #999; }